Lier sur (keyup) aux éléments dynamiques dans jQuery (Twitter Bootstrap + typehead)

Je suppose que certains d'entre vous ont fronça les sourcils à la lecture de ce titre hein ? Je suis sûr que les gens le demande à chaque fois, pourtant, je n'ai pas vu ma question donc, je vais essayer ! La liaison des événements pour créer dynamiquement des éléments est ma bête noire, j'ai juste ne peut pas envelopper la tête autour de lui ...

Alors ok, je suis en utilisant Twitter Bootstrap, avec la typehead() du plugin. Je suis en utilisant cette astuce pour le faire fonctionner à distance avec des sources de données. À ce stade, tout ce travail. Je clique sur une entrée de texte dans mon formulaire, balisés pour elle, et les scripts de chargement de sources externes et de la liste déroulante s'affiche. Mais j'ai élément dynamique de la création, et vous l'avez trouvé, il juste ne fonctionnera pas sur eux. J'ai été d'explorer le live() la méthode, mais en regardant les "comment" des scripts est de se faire licencier, je ne suis pas sûr de savoir comment je peux la mettre en œuvre.

$('#anInputField').typeahead().on('keyup', function(ev){
 //stuff happens
});

À chaque fois, il y a un keyup, le script se déclenche un jSON demande, vérifie ses choses, et obtient le résultat retour à typehead() qui est en charge de la saisie semi-automatique d'une partie du travail. Alors, comment puis-je dire à jQuery pour regarder #aDropdownID créé après la première liaison? Je suis allé sur et vérifié si je pouvais utiliser live(), mais depuis le() remplace... je suis paumé !

Toute aide appréciée !

source d'informationauteur Jean-Philippe Murray

  1. 41

    Pour on() pour être en mesure de déléguer vous avez d'appeler un élément statique que vous savez est toujours là et puis vous passez à l'élément dynamique comme:

    $('#static-parent').on('keyup', '#aDropdownID', function(ev){
 //stuff happens
});

    Si vous n'avez pas de statique de l'élément parent, alors vous pouvez toujours utiliser body.

  2. 8

    Cela fonctionne pour moi: 

    $(document).on('keyup', '#YourInputFieldId', function () {
    //stuff happens
});