如何在DIV元素上合成浏览器单击事件？

Question

使用按钮,我可以调用click()它们上的方法生成一个单击.但是,DIV在所有浏览器上都没有此方法.然而,我可以将click事件侦听器附加到它们(通过设置.onclick="..."或添加事件侦听器).

有没有办法让我以编程方式"合成"对这样一个元素的点击,但不使用jQuery？理想情况下,这将不依赖于注册的侦听器的特定方式(因此简单地调用eval(div.onclick)对我不起作用),并且在所有现代浏览器中工作.

(对于好奇,我需要这个用于自动化测试,而不是欺骗用户.)

Answer 1

我最近写了一个函数来做这个到我的库,它可以在这里的GitHub存储库中找到.

它完全是跨浏览器,并在选择器引擎返回的元素上触发指定的事件.我相信你将能够从中提取所需的代码.

如果没有,这就是你需要的.用元素替换元素.并输入事件类型,在本例中click.

// Check for createEventObject
if(document.createEventObject){
    // Trigger for Internet Explorer
    trigger = document.createEventObject();
    element.fireEvent('on' + type, trigger);
}
else {
    // Trigger for the good browsers
    trigger = document.createEvent('HTMLEvents');
    trigger.initEvent(type, true, true);
    element.dispatchEvent(trigger);
}

这是一个示例实现.

function simulateEvent(element, type) {
    // Check for createEventObject
    if(document.createEventObject){
        // Trigger for Internet Explorer
        trigger = document.createEventObject();
        element.fireEvent('on' + type, trigger);
    }
    else {
        // Trigger for the good browsers
        trigger = document.createEvent('HTMLEvents');
        trigger.initEvent(type, true, true);
        element.dispatchEvent(trigger);
    }
}