1

我正在通过 Ajax 将一些元素加载到 div 并添加一些这样的事件:

$('.zoom-container').on('touchmove click scroll mousedown mousewheel', zoom.userEvent) 

我的html:

<div id="Overlay"></div>

我创建一些内容的代码:

$(".full_screen_icon").on({        //delegation
   click: function(evt) {
        var my_html ="zoom  prtty▲thngs";
        var colWidth= $(".block-wrap[data-colspan='2']").eq(0).outerWidth() || "300px";
            //content div erstellen
            $("<div>", {
            id: "detail_content",
                css: {
                    height:colWidth,
                    width:colWidth,
                    "margin-top":-colWidth/2,
                    "margin-left":-colWidth/2
                },
                html: my_html
            })
            .appendTo("#Overlay");

        //content holen via ajax
        $.get("http://www.yxz.de/products/"+ t +".php", function( html ) {
            $("#detail_content").html(html);
        }, 'html');
    }
       .. add zoom-container with some events like above

});

要关闭覆盖,我这样做:

$("#Overlay").click(function (e) {
    $(this).find('#detail_content').empty().remove();       
});

我一直认为,如果我删除带有附加事件的元素,事件也会消失。

但是在这里,我正在加载单击相同的命名元素并附加相同的命名事件。

我看到删除 div.element 后事件仍然存在。这是我的代码中的问题还是这是正常行为?

我现在很没有安全感。事件是否与元素一起删除?

4

1 回答 1

0

如果我理解正确,您需要做的就是创建一个委托侦听器而不是常规侦听器。

$("#Overlay").on('touchmove click scroll mousedown mousewheel', '.zoom-container', zoom.userEvent); 

这样您就不会在每次出现新元素时都附加新的事件侦听器。

于 2013-06-06T10:27:54.563 回答