Question

这里添加了一个事件监听器，如果我想测试该事件监听器是否正常工作，该如何测试？ window.postMessage似乎没有触发此事件。基本上，我该如何触发“ some_event”，以便我的EventListener运行。

window.addEventListener('some_event', function() {
console.log("some_event triggered");
    });

请注意，我能够通过“ click”事件进行复制，但是我想知道的是，如何知道是否有任何字符串作为事件传递。示例：

window.addEventListener('add_to_cart', function() {
console.log("some_event triggered");
    });

因此，我想模拟此事件侦听器以检查其是否正常工作。我该如何测试。

Answer 1

您需要使用一些具体的事件名称，例如click-并单击浏览器页面窗口-例如：

window.addEventListener('click', function() {
    console.log("some_event triggered");
});

这里有一些source和触发情况。

问题更新后

是的，您可以定义和触发任意事件-阅读info about events。这是一些示例代码：

var event = new Event('some_event');

// Listen for the event.
window.addEventListener('some_event', function (e) { 
    console.log('some_event triggered') 
}, false);

// Dispatch the event.
window.dispatchEvent(event);

因此，您可以使用window.dispatchEvent(event)触发事件，这就是测试事件的方法。

Answer 2

您可以在IE中使用dispatchEvent和fireEvent触发事件。

 var ev, element = window;
  if (document.createEvent) {
    ev = document.createEvent("HTMLEvents");
    ev.initEvent("eventname", true, true);
    ev.eventName = "eventname";
    element.dispatchEvent(ev);
  } else {
    ev = document.createEventObject();
    ev.eventType = "eventname";
    ev.eventName = "eventname";
    element.fireEvent("on" + ev.eventType, event);
  }

function triggerEvent(elem, name){
   var ev;
  if (document.createEvent) {
    ev = document.createEvent("HTMLEvents");
    ev.initEvent(name, true, true);
    ev.eventName = name;
    elem.dispatchEvent(ev);
  } else {
    ev = document.createEventObject();
    ev.eventType = name;
    ev.eventName = name;
    elem.fireEvent("on" + ev.eventType, event);
  }
}
window.addEventListener("click", function(e){
  console.log("Clicked");
});
window.addEventListener("custom_event", function(e){
   console.log("custom_event triggered");
});
triggerEvent(window, "click");
triggerEvent(window, "custom_event");

如何测试window.addEventListener函数

2 个答案:

问题更新后