Question

我正在研究像javascript元素选择器这样的firebug，但是无法弄清楚如何在点击时停止所有JavaScript事件的触发。 firebug lite插件（https://getfirebug.com/firebuglite）完全按照我的意愿行事，但无法弄清楚他们在做什么。任何帮助将不胜感激。

塞纳里奥：

用户选择元素检查器
用户点击元素
onClick，mousedown，mouseup不应该开火

我试过以下但没有运气：

function stopEvents(el){

    for(var key in window) {
        if (key.indexOf("on") == 0)
            el.addEventListener(key.substr(2), stop, false);
    }
}

function StopEvent(pE)
{
    stopEvents(pE);

    if (!pE)
     if (window.event)
       pE = window.event;
     else
       return;
  if (pE.cancelBubble != null)
    pE.cancelBubble = true;
  if (pE.stopPropagation)
     pE.stopPropagation();
  if (pE.preventDefault)
     pE.preventDefault();
  if (window.event)
     pE.returnValue = false;
  if (pE.cancel != null)
     pE.cancel = true;
}

编辑：

$('.somediv').on("click", function(e){
     //Stop bubbling and propagation
     StopEvent(e);

     //EDIT: Still not working with this
     e.stopImmediatePropagation();

     //RUN only my code here
     console.log("My code is running still");

     return false;
});

如果有另一个库，例如YUI将事件绑定到同一个DOM元素。它将在我之后发射事件。我似乎无法劫持事件以阻止这种情况发生。

编辑：

我不能使用禁用，因为我需要能够解雇我的事件。如果我做了以下事情，我将无法解雇上述事件。我无法附加父事件，因为DOM将停止在树上为该节点触发所有事件。

$('.somediv').on("mouseover", function(e){
     $(this).attr("disabled", "disabled"); 
});

编辑：

我要禁用的事件已在脚本运行之前创建。这些事件可以是任何javascript库，如YUI，Dojo，jQuery，JavaScript等......

Answer 1

你不能在没有拦截实际事件绑定的情况下“禁用”所有这些，所以你必须得到这样的结果：

(function(prototypes) {
  prototypes.forEach(function(prototype) {
    var eventTracker = {};

    var oldAEL = prototype.addEventListener;
    prototype.addEventListener = function(a,b,c) {
      if (!eventTracker[a]) { eventTracker[a] = true; }
      return oldAEL.call(this, a, function(evt) {
        console.log(a, eventTracker[a]);
        if(eventTracker[a] === true) {
          b(evt);
        }
      },c);
    };

    prototype.toggleEvent = function(name, state) { 
        eventTracker[name] = state;
    }; 
  });   
}([Document.prototype, HTMLElement.prototype, ...]));

示例：http://jsfiddle.net/BYSdP/1/

按钮获得三个单击侦听器，但如果单击第二个按钮，则“click”的事件调节器将设置为false，因此所有事件都不会实际触发最初提供的代码。请注意，这也会使调试变得更难，因为您将处理程序包装在匿名函数中。

Answer 2

禁用页面上的所有活动非常简单。困难的部分是在需要时恢复它们。

document.body.innerHTML = document.body.innerHTML;

这将通过用它的“原始”副本替换DOM来有效地删除绑定到DOM节点的所有事件。

大多数时候，用户甚至都不会注意到重绘。

Answer 3

event.stopImmediatePropagation()使其余的处理程序不被执行并阻止冒泡DOM树的事件。

示例：

$( "p" ).click(function( event ) {
  event.stopImmediatePropagation();
});

$( "p" ).click(function( event ) {
  // This function won't be executed
  $( this ).css( "background-color", "#f00" );
});

来源：https://api.jquery.com/event.stopimmediatepropagation/

阻止所有javascript事件触发

3 个答案: