Les éléments HTML dynamiquement ajoutés ne peuvent pas être trouvés à l'aide de jQuery

J'implémente un navigateur d'arborescence en HTML. En cliquant sur un nœud, j'appelle une fonction qui ajoute les éléments enfants du nœud. Jusqu'ici tout va bien. Je veux maintenant invoquer immédiatement le gestionnaire de clic de l'un des éléments enfants pour l'étendre aussi. Mon problème est que jQuery ne peut pas trouver les éléments enfants qui viennent d'être ajoutés. Lorsque j'interviens dans le débogueur, mon code pour trouver les éléments est invoqué avant que les nouveaux éléments soient restitués par le navigateur, ce qui, je suppose, est le problème.Les éléments HTML dynamiquement ajoutés ne peuvent pas être trouvés à l'aide de jQuery

Y at-il un événement que je peux attendre (similaire à onload peut-être) qui marque quand le HTML nouvellement ajouté est visible? Ou une méthode que je peux appeler pour forcer le rendu à avoir lieu plus tôt? Toute suggestion serait la bienvenue.

Note: J'ai depuis réalisé que le problème était entièrement de ma faute, pas celui du navigateur ou de jQuery. S'il vous plaît voir ma réponse ci-dessous.

Source

2010-03-10 Charles Anderson

Une partie du code serait utile afin de vous aider. –

Pourriez-vous ajouter une partie du code problématique pour aider à donner une solution plus spécifique? – deceze

J'ai finalement résolu le problème en utilisant setTimeout() pour retarder mon code jusqu'à ce que les nouveaux éléments aient été rendus. Ce n'est pas une solution idéale, car le délai d'attente que j'ai choisi est assez arbitraire.

Je suis au plus bas. La fonction que j'appelais qui ajoutait que le HTML le faisait de manière asynchrone via un callback. Donc quand j'essayais de trouver les nouveaux éléments HTML, ils n'étaient pas encore là. J'ai maintenant modifié mon code afin que le callback soit également responsable du traitement des éléments nouvellement ajoutés, garantissant ainsi leur présence.

Source

2010-03-10 17:00:04

Vous pouvez utiliser .live() for this, plate-forme de votre gestionnaire de clic pour elle au lieu de simplement .click() comme ceci:

$(document).ready(function() { 
    //instead of $(".myTreeNode").click(.... 
    $(".myTreeNode").live('click', function() { 
    //Do stuff 
    }); 
});

Un .click() se fixe des gestionnaires d'événements aux éléments qu'il trouve quand il est exécuté, afin que les nouveaux éléments n » t avoir le gestionnaire. .live() écoute plutôt au niveau du DOM pour que les clics se produisent, donc peu importe s'ils sont ajoutés maintenant ou plus tard. Dans le cas d'un grand nombre d'éléments, vous avez également un gestionnaire d'événements au lieu de 1 pour chaque élément, après quelques éléments, cela devient également plus efficace.

Source

2010-03-10 11:14:04

J'ai essayé ça, mais ça ne l'a pas réparé. Le problème est que le HTML nouvellement ajouté ne semble pas être accessible aux trouvailles de jQuery tant qu'il n'a pas été rendu, et c'est toujours dans le futur. –

@Charles - Faites-vous autre chose que lier un événement click? les clics devraient être gérés par 'live()' ou '.delegate()' si vous le voulez plus local. –

"live" est dépréciée depuis jquery 1.7+ Essayez donc cela,

$(document).on("click","#Cancel" , function(){ 
//do something 
});

Visitez http://api.jquery.com/on/ pour plus d'informations

Source

2014-02-21 17:39:51 mesut

Les éléments HTML dynamiquement ajoutés ne peuvent pas être trouvés à l'aide de jQuery

Répondre

Questions connexes