在jQuery中删除事件特定事件处理程序的最佳方法

时间:2013-01-16 22:20:02

标签: jquery

所以,情况就是这样。我有几个相同类型的对象都在监听同一个事件。每个对象的处理程序操纵DOM的某些部分。这些对象几乎可以在任何时候重新创建或销毁,当它们被销毁时,它们会占用它们负责的DOM部分。问题是这些对象的处理程序会在对象被销毁后继续尝试操作DOM。

以下是我的代码似乎有效。但是我不关心处理程序被破坏的方式,我怀疑它可能对jQuery不好。还有更好的方法吗?

        var ID: "uniqueID",
    connectEvents: function ()
    {
      $(someDiv).on("customEvent", this, this.eventHandler);
    },
    eventHandler: function (e)
    {
        //do some stuff to the DOM
    },
    destroy: function ()
    {
      var gridCell = this;
      if (jQuery(someDiv).data("events"))
      {
         var handlers = jQuery(someDiv).data("events").customEvent
         var handlerIndex = -1;
         $(handlers).each(function (i, handler)
         {
            if (handler.data.ID === ID)
               handlerIndex = i;
         });
         if (handlerIndex > 0)
         {
            handlers.splice(handlerIndex, 1);
         }
      }
      //Destroy some Dom elements
    }

2 个答案:

答案 0 :(得分:0)

我们可以说这些元素有一个类似'test'的类,

你能做的是:

$('.test').click(function(){
   $(this).off(); // remove all event handlers assigned to this object with class test that has been clicked.

   $(this).remove(); // removes the element
})

答案 1 :(得分:0)

事件处理委托给祖先div,声明为:

$(someDiv).on("customEvent", this, this.eventHandler);

如果这是附加this.eventHandler的唯一声明,并且在删除目标元素后仍然看到eventHandler行为,那么somediv 必须仍然包含一些其他元素,它还将其“customEvent”委托给祖先div。

根据@charlietfl的建议,事件命名空间可能很好地解决了眼前的问题,但我不认为这是一个完整的解决方案。需要修复一些更基本的东西。

您可能将“customEvent”委托给比您意识到的更多元素。