Повторно прикрепить событие к недавно загруженному div

Question

Очевидно, мои события JQuery умирают при замене элементов. В настоящее время они прикреплены так:

$("a[id^='anb']").click(
        function () {
            /* ommited for readability */;
            var furl = "target_view";
            $('#my_article_container').load(furl, function() {
                       animateThem(); });
            return false;
        }

    );

    $("div[id^='art']").hover(
        function() {
            $(this).fadeTo("slow", 0.33);
        }
    );

Есть ли в JQuery какой-нибудь механизм или удобная работа по повторной привязке этих событий?

Answer 1

Вы ищете функцию .live() .

Это автоматически отслеживает события dom и reattach при добавлении элементов.

$("a[id^='anb']").live('click',
    function () {
        /* ommited for readability */;
        var furl = "target_view";
        $('#my_article_container').load(furl, function() {
                   animateThem(); });
        return false;
    }

);

$("div[id^='art']").live('hover',
    function() {
        $(this).fadeTo("slow", 0.33);
    }
);

Answer 2

Это был первый ответ, который я нашел, когда гуглил - у меня возникла та же проблема. Live был объявлен устаревшим в версии 1.7 и удален в версии 1.9. Новые версии JQuery рекомендуют использовать на. jQuery.on ()

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

$(document).on("click","a[id^='anb']",function(){....})

Answer 3

Я полагаю, вы ищете jQuery.live ()

Answer 4

Live твой друг

Answer 5

Вместо этого используйте $ .live (), который предназначен для работы именно в этом случае.

$("a[id^='anb']").live('click', function() { ... });
$("a[id^='art']").live('hover', function() { ... });

Answer 6

Вместо этого используйте функцию live.