【问题标题】:Are events lost in jQuery when you remove() an element and append() it elsewhere?当您 remove() 一个元素并将其 append() 到别处时,事件是否会在 jQuery 中丢失?
【发布时间】:2010-10-08 05:34:18
【问题描述】:

当你 remove() 一个元素并将它 append() 到别处时,jQuery 会发生什么?

似乎这些事件没有挂钩 - 就好像您只是插入新的 html 一样(我猜这是正在发生的事情)。但我的代码也可能有错误 - 所以我只是想在继续之前验证这种行为。

如果是这种情况 - 是否有任何简单的方法可以将事件重新连接到 HTML 的那部分,或者有其他方法来移动元素而不会丢失事件。

【问题讨论】:

    标签: javascript jquery dom javascript-events event-handling


    【解决方案1】:

    jQuery detach() 函数与 remove() 相同,但在它返回的对象中保留了事件处理程序。如果您必须删除该项目并将其放置在其他地方,您可以使用它。

    var objectWithEvents = $('#old').detach();
    $('#new').append(objectWithEvents);
    

    在此处查看 API 文档:http://api.jquery.com/detach/

    【讨论】:

    • 我需要对一堆元素进行排序,使用 $parent.empty() 将它们从父级中删除,然后将排序后的元素列表附加回其父级。这对我来说是正确的答案。谢谢!
    【解决方案2】:

    是的,jQuery 使用remove() 的方法是取消绑定与 jQuery 自己的bind 绑定的所有内容(以防止内存泄漏)。

    但是,如果您只想在 DOM 中移动某些内容,则不必先 remove() 它。只要append 满足您的需求,事件绑定一直存在:)

    例如,将其粘贴到此页面上的 firebug 中:

    $('li.wmd-button:eq(2)').click(function(){ alert('still here!') }).appendTo(document.body)
    

    现在向下滚动到此页面的底部,然后单击现在埋在 SO 页脚下的小球状图标。您将获得alert。这一切都是因为我注意不要先remove

    【讨论】:

    • 酷。我希望是这样的。是的交互式stackoverflow!
    • @ceescentfresh 回答这个问题十周年快乐 :-)
    • @Simon_Weaver:废话十年
    【解决方案3】:

    使用jQuery1.3.1 live()绑定事件,你不用担心这个..

    更新:现在不推荐使用实时事件,但您可以从 $(document).on() 获得相同的效果。

    【讨论】:

    • 我原来的问题是这样吗?到底发生了什么。我现在会检查“现场”
    • 了解现场直播当然好 - 但要注意这里的警告docs.jquery.com/Events/live#typefn
    • 如果您使用的是特定的 dom 对象而不是选择器,则不适用。这也是我的第一个想法。
    猜你喜欢
    • 2014-09-27
    • 2010-12-02
    • 2014-12-12
    • 1970-01-01
    • 2013-12-16
    • 2014-12-06
    • 2011-10-06
    • 1970-01-01
    • 2012-02-20
    相关资源
    最近更新 更多