Подтвердить что ты не робот

Привязать (keyup) к динамическим элементам в jQuery (Twitter Bootstrap + typehead)

Я думаю, некоторые из вас, должно быть, нахмурились брови, читая это название, а? Я уверен, что люди спрашивают об этом каждый раз, но я не видел своего конкретного вопроса, поэтому я пытаюсь! Связывание событий с динамически создаваемыми элементами - это мой криптонит, я просто не могу обернуть вокруг него голову...

Так хорошо, я использую Twitter Boostrap, с плагином typehead(). Я использую этот трюк, чтобы заставить его работать с удаленными источниками данных. На данный момент все работает. Я нажимаю на текстовый ввод в моей форме, помечен для него, и скрипты загружают внешние источники, и появляется раскрывающийся список. Но у меня есть динамическое создание элемента, и вы поняли, что он просто не будет работать на них. Я изучал метод live(), но, глядя на "как" сценарии запускаются, я просто не знаю, как я могу его реализовать.

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

Каждый раз, когда есть keyup, script запускает запрос jSON, проверяет его вещи и возвращает результат в typehead(), который выполняет автозаполнение части задания. Итак, как я могу сказать jQuery, чтобы посмотреть на #aDropdownID, созданный после первоначального связывания? Я продолжал и проверял, могу ли я использовать live(), но поскольку on() заменяет его... Я не знаю!

Любая помощь оценивается!

4b9b3361

Ответ 1

Для on(), чтобы иметь возможность делегировать, вы должны называть его статическим элементом, который, как вы знаете, всегда будет там, а затем вы передаете динамический элемент, например:

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

Если у вас нет статического родительского элемента, вы всегда можете использовать body.

Ответ 2

Это работает для меня:

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