Связывание обработчика событий с динамически загруженным входом

Question

У меня есть поле ввода страниц, которое динамически создается после того, как на главной странице сделан запрос ajax с главной страницы для загрузки некоторых данных. Поле ввода имеет класс goto.

Так как это: - главная страница имеет скрипт с функцией называется loadData() - когда пользователь делает вызов AJAX, таблицы извлекается из базы данных через AJAX. - эти данные ajax включают в себя языковые табуляции (First, Prev, Next, Last), а также поле .goto, в котором пользователи могут вводить номер страницы. Когда пользователь вводит номер страницы, следует вызвать функцию loadData() главной страницы.

Это мой код (это на главной странице):

$('.goto').bind('keydown', function(e){ 
     console.log(e.which); 
     if(e.which==13) 
     loadData($(this).val()); 
    }); 

Но ничего не происходит. Ни консольного сообщения, ни ничего.

Answer 1

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

В вашем случае, следующее должно работать:

$(document).on('keydown', '.goto', function(e){ 
    console.log(e.which); 
    if(e.which==13) 
    loadData($(this).val()); 
});