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

问题描述 投票:13回答:2

对于JS Unit测试,我需要检查双击是否按预期运行。问题是该事件是通过element.addEventListener注册的。由于某种原因,在这种情况下,element.ondblclick()不起作用。 HTML:

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

JavaScript的:

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

小提琴:http://jsfiddle.net/prZKy/

如果你双击图像,它可以工作,但javascript中的ondblclick()不起作用。

任何人都知道如何做到这一点?

javascript events double-click
2个回答
19
投票

您可以使用dispatchEvent以编程方式触发事件:

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

请参阅MDN上的“触发内置事件”部分。

Here是行动代码的小提琴。


2
投票

这应该工作:

var doubleClickEvent = document.createEvent('MouseEvents');
doubleClickEvent.initEvent('dblclick', true, true);
e.currentTarget.dispatchEvent(doubleClickEvent); // inside method
© www.soinside.com 2019 - 2024. All rights reserved.