如何以编程方式触发使用addEventListener定义的dblclick事件？

Question

对于JS单元测试，我需要检查双击行为是否符合预期。问题是该事件是通过element.addEventListener注册的。由于某种原因，在这种情况下，element.ondblclick()无法正常工作。 HTML：

<input type="image" src="pic.jpg" id="aa"/>

Javasript:

document.getElementById('aa').addEventListener("dblclick", function(){alert('aa')});
document.getElementById('aa').ondblclick();

Fiddle: http://jsfiddle.net/prZKy/

如果您双击图片，它将起作用，但是javascript中的ondblclick()不起作用。有人有想法如何解决吗？

- Stilltorik

---

https://developer.mozilla.org/en-US/docs/Web/API/EventTarget.dispatchEvent - karaxuna

有趣的是，这个有效 - http://jsfiddle.net/MNx9K/ 为什么？ - Vandesh

Answer 1

您可以使用dispatchEvent来编程触发事件：

var event = new MouseEvent('dblclick', {
    'view': window,
    'bubbles': true,
    'cancelable': true
  });
document.getElementById('aa').dispatchEvent(event);

请查看MDN上的“触发内置事件”章节。

- CodingIntrigue

---

因为IE9很糟糕，不识别“dblclick”事件。你需要自己编写一个“click”处理程序，并设置一个超时来模拟双击。呸！ - CodingIntrigue

如何将 "dispatchEvent" 分派给坐标而不是元素？ - Dee

Answer 2

这应该可以工作：

var doubleClickEvent = document.createEvent('MouseEvents');
doubleClickEvent.initEvent('dblclick', true, true);
e.currentTarget.dispatchEvent(doubleClickEvent); // inside method

- Namish