Je dois appliquer un plugin JQuery à un élément HTML qui sera créé sur l'entrée d'un utilisateur. Par exemple: sous la forme la plus simple, je peux appeler le plugin à l'intérieur du gestionnaire de clic code> S, après la création de la division DIV. P > Cependant, si possible, je cherche quelque chose qui est plus "automatique"; Peut-être utiliser Paraphraser la question: strong>
À JQuery, est-il un moyen de "surveiller" quand un certain élément devient disponible (c'est-à-dire après sa création)? S'il y a, j'appellerais alors le plugin ou d'autres fonctions comme rappel. P> p> .on () code> invoque automatiquement le plugin une fois que l'élément devient disponible? p>
7 Réponses :
Vous pouvez utiliser live () code> ou
sur () code> pour ce
Avec ceux-ci, vous devez appeler la méthode à l'aide d'un élément déjà chargé et utilisez un paramètre pour spécifier à l'élément qui déclenche l'événement. Pour que cela soit aussi efficace que possible, cet élément doit être le parent le plus proche de l'élément créé de manière dynamique. P> Par exemple, s'il clique de la balise d'ancrage, vous placez une DIV avec ID de "cible" dans un conteneur qui a déjà été chargé avant l'appel sur délégué code> et
sur code> est bon pour cela. Notez que si vous utilisez des anciennes versions de jQuery, vous pouvez utiliser
délégué code> mais si vous utilisez la dernière version (1.7+), vous devez utiliser
sur code>.
sur code>, avec un identifiant de "conteneur", votre
sur code> appel doit être. p>
$('#container').on('click', '#target', function(){ $(this).pluginCall(); });
Merci pour l'explication, @andbeyond.
OK, donc dans ce cas, vous devez appeler le plugin OnComplete de la demande AJAX ou une fois que le contenu est placé sur le DOM.
Cela remonte à la question initiale: Comment déclencher le plugin après que l'élément est disponible sans i> le faire directement à l'intérieur du
Vous avez clairement une fonction qui incendie le clic de l'ancre qui place une nouvelle Div sur le DOM, donc juste avant que cette fonction ne renvoie que vous ajoutez simplement la ligne qui appelle votre plugin
@ Siku-siku.com, voyons le code qui crée de manière dynamique le nouvel élément. $ ('# conteneur'). On (click ',' #Target ', fonction () {$ (ceci) .Pluginall ();}); code> nécessite réellement
#Target < / code> à cliquer avant les incendies de plug-in. Je veux que le plugin ait le feu immédiatement i> après le nouveau
code> cliquez sur le gestionnaire?
Si vous devez vérifier l'élément est là avant d'appeler le plugin, vous pouvez probablement essayer quelque chose comme ceci: Vous pouvez le voir fonctionner ici . p> Notez que la fonction .button code> est une initialisation du plug-in jQuery UI, donc Il devrait également fonctionner pour le plugin dont vous avez besoin. Vous devriez également modifier le deuxième argument de seinterval en quelque chose d'autre, 200 est juste pour montrer un délai. P> p>
HHMM ... Cela a en fait exactement la même étape que mon code dans la question. Ce que j'essaie de résoudre, c'est comment pas i> d'appeler le plugin à l'intérieur du .Click () code>.
Vous pouvez utiliser 'DomnodeIserted' qui n'est pas un événement JQuery.
$(document).bind('DOMNodeInserted', function(event) { //write your stuff here to check if desired element was inserted or not. alert('inserted ' + event.target.nodeName + // new node ' in ' + event.relatedNode.nodeName); // parent });
Bind () Code> a été obsolète et remplacé par
sur () code>.
Peut-être quelque chose comme ça?
Déclenchement de l'événement personnalisé Vous permet de lier le gestionnaire d'événements plus tard. p> p>
N'est-ce pas la même chose que d'exécuter simplement le plugin dans la même fonction que la DIV est créée.
Eh bien, il est similaire, mais vous déclenchez un événement une fois au même endroit, vous pouvez ensuite lier plusieurs événements gesuant plus tard.
Cela ne fournit pas exactement la solution à la question présentée. Cependant, il suggère une alternative intéressante: déclencher un événement personnalisé en utilisant déclencheur () code>. Ainsi, dans l'intérêt du temps, cela a été choisi comme réponse acceptée. Merci!
Je serais également intéressé de voir le code qui insère le nouvel objet DOM. Supposons que c'est quelque chose comme ceci: (vous ne devriez vraiment pas utiliser est le meilleur que je puisse faire sans voir plus d'informations ... < / P> Cliquez sur la gâchette, insérez le nouveau DIV, saisissez cet objet et exécutez le plugin dessus. Fondamentalement, vous opérez sur la div onclick code> gestionnaires)
Je cherchais en fait un moyen possible de moniteur i> comme indiqué à l'origine dans la question.
Pourquoi auriez-vous besoin de i> Si i> si Vous êtes B> Créer l'élément DOM. Il suffit d'exécuter le plugin lorsque vous créez l'élément DOM ... Sauf si vous avez un mécanisme pour les utilisateurs d'injecter JavaScript dans votre page, cela devrait être tout ce que vous devez faire.
Si vous ne pouvez pas apporter le plugin en même temps que la création d'élément (comme andbeyond suggéré dans leur Commentaire), pour une raison quelconque, mes conseils seraient d'utiliser le plug-in Liveon Aaron de Brandon Aaron: P>
http://brandonaaron.net/code/livequery/docs p>
... La requête en direct a également la possibilité de déclencher une fonction (rappel) lorsqu'elle correspond à un nouvel élément et une autre fonction (rappel) pour quand un élément n'est plus assorti. Cela fournit une flexibilité ultime et des cas d'utilisation indicibles. P> blockQuote>
J'espère que c'est utile :) p>
jQuery intégré .on () code> méthode prend déjà soin de ce que ce plugin est censé couvrir.
Pouvez-vous expliquer pourquoi exécuter le plugin dans la même fonction que vous créez que la DIV n'est pas une option viable, il me semble être le plus efficace?