Jquery late binding

У меня есть код, который связывается при нажатии на загрузку страницы, это ссылка. Когда я нажимаю на него, он отправляет запрос ajax и заменяет содержимое в div с помощью функции jquery append(). У этого нового контента есть ссылки, и мне нужно связать какое-то действие для них, но я не мог.. bind did't work Я думаю, потому что jquery append не обновляет дерево DOM. Как я могу получить последнее связывание?

ОТВЕТЫ

Ответ 1

Позднее связывание теперь доступно с помощью события jQuery live():

$('a.my-links-class').live('click', function() {
    // do your link action here
});

Ответ 2

Есть 3 функции, которые могут это сделать:

  • $(selector).live(events, data, handler); - jQuery 1.3+ - версия устарела: 1.7, удалена: 1.9 (ссылка)
  • $(document).delegate(selector, events, data, handler); - jQuery 1.4.3+ - Начиная с jQuery 1.7,.delegate() был заменен методом .on(). (ссылка)
  • $(document).on(events, selector, data, handler); - jQuery 1.7+ - предпочтительный (ссылка)

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

  • Первый вызов должен существовать при вызове функции и не может быть удалён или событие тоже исчезнет (это может быть document).
  • Первым параметром является событие (например, "click")
  • Второй параметр - это селектор, для которого вы хотите привязать событие.
  • Затем, наконец, вы можете добавить некоторые специальные данные и функцию к событию.

Вот пример кода:

// Make sure the DOM is ready
$(function() {
    // Bind the click event to the function
    $(document).on("click", "a.class", function(event) {
        // Put your code here.
    });
});

Ответ 3

событие .live() было устарело из версий 1.9 вверх.

Для тех, кто использует более позднюю версию Jquery, они могут использовать событие .on(), он работает примерно так же.

Ответ 4

Метод .live в JQuery 1.9 устарел. Итак, теперь вы можете сделать так:

$("body").on("click", ".classname", function() { ... })

Ответ 5

Вам нужно использовать функцию jQuery live, которая привяжет событие ко всем элементам, которые соответствуют селектору, независимо от того, когда они были созданы.

Ответ 6

Вы можете использовать функцию jQuery 1.3+ $().live(event, function). $("a").live("click", myClickFunc) свяжет myClickFunc так же, как $("a").click(myClickFunc) или $("a").bind("click", myClickFunc), но события будут связаны "вживую", поэтому элементы, добавленные в DOM после этого вызова функции, также будут связаны. Вы можете удалить события, связанные с проживанием, с помощью $().die(). Для получения дополнительной информации о $(). Live, см. документацию для него.

Другим вариантом было бы иметь функцию привязки элементов, заданных определенным контекстом (с использованием функции $selector, которая редко используется вторым параметром):

function myBindEvents(context) {
     $("a", context).click(myClickFunc);
}

и вызовите это, когда вы обновляете элемент с помощью AJAX:

$("<div>").load("...", "...", function(){myBindEvents(this);});

Надеюсь, это поможет.:)

Ответ 7

В моем случае я использую js-библиотеку в том, что у меня есть переменная элемента, и код был похож

$(element).click(function(){
    //some action
});

но это не работает с моим последним связывающим элементом. Поэтому я, наконец, использую событие js click

element.addEventListener('click', function() {
    //My some action
}, false);