1

我只想mouseup从选定的 HTML 元素中删除事件侦听器。

我使用了下面的代码，但它会删除所有侦听器。

var old_element = divs[d];
                var new_element = old_element.cloneNode(true);
                old_element.parentNode.replaceChild(new_element, old_element);

这就是我附加事件监听器的方式。

var divs = document.getElementsByTagName('body');// to enhance the preformance
for(var d in divs) { 
        try{             
            if (divs[d].addEventListener) {
                 divs[d].addEventListener('mouseup',callHighlight);
            } else {
                divs[d].attachEvent('mouseup', callHighlight);
            } 
        }catch(err){
            //alert(err.message);
        }
}
4

3 回答 3

1

您应该使用removeEventListener而不是 replacechild ，这显然会删除所有事件。

 old_element.removeEventListener('mouseup', handler);
于 2013-10-14T02:23:54.230 回答
1

克隆元素时，使用addEventListener或通过直接属性分配 ( element.onclick = fn;) 添加的侦听器将被删除，但内联侦听器和使用 IE 的attachEvent添加的侦听器不会。

在您通过引用添加侦听器并可能使用attachEvent的场景中，您最好使用removeEventListener和detachEvent删除它们。因此，您可能希望创建添加和删除功能，例如：

function addEvent(element, event, fn) {
  if (element.addEventListener) {
    element.addEventListener(event, fn, false);
  } else if (element.attachEvent) {
    element.attachEvent('on' + event, fn);
  }
}

function removeEvent(element, event, fn) {
  if (element.removeEventListener) {
    element.removeEventListener(event, fn);
  } else if (element.detachEvent) {
    element.detachEvent('on' + event, fn);
  }
}

请注意addEventListener和attachEvent之间存在一些显着差异，最重要的是在后者中，this未设置为其处理程序正在调用函数的元素，并且对事件的引用未作为第一个参数传递给听众。所以监听器函数最终看起来像：

function foo(evt) {
  evt = evt || window.event;
  var target = evt.target || evt.srcElement;
  ...
}

有一些方法可以解决这个问题，但它们会引入更多问题。如果可以的话，保持简单。

于 2013-10-14T02:50:02.923 回答
0

默认情况下，所有事件监听器都是空的，所以只需重置它。问题是您的所有 mouseup 事件都已注册到正文，因此如果不先停止事件冒泡到正文，您将无法删除该事件。你可以解决这个问题，stopPropagation()

 old_element.onmouseup = function (e) {
   // event won't go up to the body tag
   e.stopPropagation();
   return null;
 };

或者

 function kill (e) {
  e.stopPropagation(); 
  return null; 
 }

 old_element.onmouseup = kill;
 second_element.onmouseup = kill;

JSFIDDLE

于 2013-10-14T02:38:14.227 回答