Question

我正在寻找实现以下目标的方法。我可以建立一些机制来做到这一点，我要求内置的东西或一种非常简单的方法，如果它存在并且我错过它。

修改请注意，我在谈论随机对象中的事件，而不是DOM元素。无法使用父级等管理事件订单，如可能的副本中所示。

编辑2： 也许是一个叫做所有处理程序的回调？或者总是最后执行的处理程序？

假设：

var someObject={};
$(someObject).on("event",function() { console.log('Default handler'); });
...
$(someObject).on("event",function() { console.log('Other handler'); });

做的时候：

$(someObject).triggerHandler("event");

输出结果为：

Default handler
Other handler

我们都知道这一点。问题是：如果我想让第一个事件成为“默认”处理程序，如果没有其他事件处理程序（在那里没有问题）或者其他处理程序没有停止事件传播，则执行该怎么办？这是问题所在。）

我正在寻找一种方法来做类似的事情：

$(someObject).on("event",function(ev) { ev.preventDefault(); });

并阻止第一个事件处理程序执行。在给定执行顺序的情况下，此示例不起作用。反转执行顺序不是正确的方法。

TL; DR

是否可以设置一个默认处理程序，如果没有其他处理程序并且事件尚未被取消，则可以调用一个处理程序？

编辑3：为了让您更好地了解，目前的方法如下（此示例的名称已经完成）：

var eventCanceled=false;
function doTheEvent() {
    $(someObject).triggerHandler("event");
    if(!eventCanceled) defaultEventHandler();
}
//To be called inside the handlers to stop the default handler
function cancelTheEvent() {
    eventCanceled=true;
}

我只是想摆脱这种情况，并且能够直接使用triggerHandler。

Answer 1

希望这就是你要找的东西。这称为观察者模式。

var someObj = {};
someObj.eventCallbackList = {};
someObj.createEventObject = function(name) {
  return {
    type: name,
    preventDefault: function() {
      this.callDefault = false;
    },
    callDefault: true
  }
}
someObj.on = function(eventName, callback, defaultFlag) {
  if (!this.eventCallbackList[eventName]) {
    // there can be multiple other handlers
    this.eventCallbackList[eventName] = {
      other: [],
      default: null
    };
  }

  if (defaultFlag) {
    this.eventCallbackList[eventName]['default'] = callback;
  } else {
    this.eventCallbackList[eventName]['other'].push(callback);

  }
}

someObj.triggerHandler = function(eventName) {
  var event = this.createEventObject(eventName);
  var callbacks = this.eventCallbackList[eventName];

  if (callbacks) {
    if (callbacks['other']) {
      for (var i = 0; i < callbacks['other'].length; i++) {
        callbacks['other'][i](event);
      }
    }

    if (event.callDefault && callbacks['default']) {
      callbacks['default'](event);

    }
  }


}




// Test 

someObj.on('myCustomEvent', function(event) {
  console.log('OtherHandler');
  event.preventDefault();
});

someObj.on('myCustomEvent', function(event) {
  console.log('default');
}, true);

$(document).on('click', function() {
  someObj.triggerHandler('myCustomEvent');
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Answer 2

您可以添加一个参数来设置您要在triggerHandler函数中执行的代码。

您可以在添加参数时参考此主题。 jQuery: receive extraParameters from triggerHandler()

Answer 3

如果调用了preventDefault（），则有a way to detect，但没有“默认处理程序”。事件处理程序按其注册顺序执行。所以注册的第一个是第一个被执行的。

如果你的“默认处理程序”不需要同步执行，你可以延迟在所有其他处理程序完成后执行“默认处理程序”，并在任何其他处理程序中恢复，如果有必要：

var defaultHandlerTimeout;
$element.on('event', function() {
  defaultHandlerTimeout = setTimeout(function() {
    // your actual handler
  });
});

$element.on('event', function() {
  // prevent the "default handler" from being executed
  clearTimeout(defaultHandlerTimeout);
});

Answer 4

jQuery会在内部存储所有事件，您可以使用$._data(elem,'events')访问特定的元素事件。

这是否会对你的情况有所帮助我不确定但值得深入研究。就个人而言，我从未发现需要使用它。

请参阅https://stackoverflow.com/a/2518441/1175966

jQuery中的默认事件处理程序

4 个答案: