Как динамически прикрепить поведение к динамически загружаемым элементам в HTML, используя jQuery

Question

У меня есть HTML-форма, которая динамически присоединяется к элементу div. Как я могу прикрепить существующее поведение к вновь добавленным элементам.

Например. У меня есть методы, такие как

$.fn.jqueryAjaxFormLoad - defined in jquery.ajaxload.js
$.fn.displayMessage  - defined in jquery.messagebar.js

уже определены, которые были загружены во время загрузки страницы. Теперь я хочу добавить или сделать их доступными для вновь добавленного элемента формы и его дочерних элементов. Что было бы лучшим способом достичь этого с помощью jQuery.

Конец ожидания в том, что я могу позвонить

$ ('. Form_element'). DisplayMessage () для одного из элементов формы.

Answer 1

Вы можете использовать следующий код для запуска события при нажатии элемента:

$("#something").click(function(){
    alert("Something was clicked!");
});

Просто замените click на событие, которое вы хотите использовать. Вы можете увидеть список событий на этой странице .

Если ваше событие отсутствует в списке событий по вышеуказанной ссылке, просто используйте этот код:

$("#something").bind("touchstart",function(){
    alert("You tapped something!");
});

Приведенный выше код выдаст предупреждение, когда пользователь коснется экрана мобильного устройства. Просто измените touchstart на любое событие, которое вам нужно использовать.

Ad @ м

Answer 2

Используя jQuery .live(), вы можете привязывать обработчики событий к объектам, и события будут запускаться, даже если новые объекты добавляются через AJAX.

http://api.jquery.com/live/

Простым примером будет:

$('#foo').live('click', function() {
    // this will be called even if #foo is added minutes after the initial page load!
});

Answer 3

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