Analyse du problème du chargement asynchrone de l'arbre jQuery Easyui

Quand je veux charger des fichiers json depuis local et les insérer dynamiquement dans ul via des événements, j'ai rencontré un petit bug

Le code dans le html est comme ça

<ul class="easyui-tree" id="tt"></ul>

Code en js

$(".next-menu:nth-child(1) a").click(function() {
var $IDstr = $(this).attr("id"),
$treeIDNum = parseInt($(this).attr("treeID")),
jsonURL = "json/" + $IDstr + ".json",
node;
addAttr2Tree(jsonURL)；
changeImgSrc($treeIDNum);
});
});
function changeImgSrc(nodeID){
var node = $("#tt").tree('find', nodeID);
if(node){
$("#tt").tree('select', node.target);
}
if (node.attributes) {
$("#img-box").attr("src", node.attributes.url);
}
}
function addAttr2Tree(URL){
$("#tt").tree({
url: URL,
method: "get",
animate: true,
lines: true
});
}

Au début, je voulais charger dynamiquement le contenu de l'arborescence via un événement clic sur un bouton, qui est le code ci-dessus, addAttr2Tree est utilisé pour ajouter les données json locales correspondant au moment où le bouton est cliqué à la balise ul en HTML, changeImgSrc est utilisé pour sélectionner certains nœuds d'arborescence et charger des images, mais peu importe la façon dont vous déboguez, une erreur sera toujours apparaît

Impossible d'obtenir l'attribut attributs ! ! ! J'ai confirmé à plusieurs reprises que les attributs sont intacts dans le fichier json et cette erreur se produit toujours lorsque je clique sur le bouton pour la première fois et par la suite, cette erreur ne se produit pas

Plus tard, j'ai pensé que c'était le cas. parce que la vitesse de chargement dynamique des données json n'est pas aussi rapide que la vitesse d'exécution du code du programme ? !

C’est exactement ce à quoi je m’attendais ! L'arbre dans easyui est livré avec une méthode onLoadSuccess Lorsque les données sont chargées avec succès, certaines opérations seront effectuées
Donc

$(".next-menu:nth-child(1) a").click(function() {
var $IDstr = $(this).attr("id"),
$treeIDNum = parseInt($(this).attr("treeID")),
jsonURL = "json/" + $IDstr + ".json",
node;
addAttr2Tree(jsonURL);
$("#tt").tree({
onLoadSuccess: function(){
changeImgSrc($treeIDNum);
}
});
});

Le code est modifié. à ça, c'est tout.

Ce qui précède est l'analyse du problème de l'arbre de chargement asynchrone jQuery Easyui introduit par l'éditeur. J'espère que cela vous sera utile. Si vous avez des questions, veuillez me laisser un message et l'éditeur vous répondra. vous à temps. Je voudrais également vous remercier tous pour votre soutien au site Web PHP chinois !

Pour plus d'articles sur l'analyse des problèmes de chargement asynchrone de l'arbre jQuery Easyui, veuillez faire attention au site Web PHP chinois !