如何使用 JavaScript 模拟点击？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/2705583/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to simulate a click with JavaScript?
提问by Belgin Fish
I'm just wondering how I can use JavaScript to simulate a click on an element.
我只是想知道如何使用 JavaScript 来模拟对元素的点击。
Currently I have:
目前我有：
<script type="text/javascript">
function simulateClick(control)
{
if (document.all)
{
control.click();
}
else
{
var evObj = document.createEvent('MouseEvents');
evObj.initMouseEvent('click', true, true, window, 1, 12, 345, 7, 220, false, false, true, false, 0, null );
control.dispatchEvent(evObj);
}
}
</script>
<a href="http://www.google.com" id="mytest1">test 1</a><br>
<script type="text/javascript">
simulateClick(document.getElementById('mytest1'));
</script>
But it's not working :(
但它不起作用:(
Any ideas?
有任何想法吗？
回答by KooiInc
Here's what I cooked up. It's pretty simple, but it works:
这是我做的。这很简单，但它有效：
function eventFire(el, etype){
if (el.fireEvent) {
el.fireEvent('on' + etype);
} else {
var evObj = document.createEvent('Events');
evObj.initEvent(etype, true, false);
el.dispatchEvent(evObj);
}
}
Usage:
用法：
eventFire(document.getElementById('mytest1'), 'click');
回答by Darren Sweeney
回答by BradBrening
Have you considered using jQuery to avoid all the browser detection? With jQuery, it would be as simple as:
您是否考虑过使用 jQuery 来避免所有浏览器检测？使用 jQuery，它会很简单：
$("#mytest1").click();
回答by mnishiguchi
var elem = document.getElementById('mytest1');
// Simulate clicking on the specified element.
triggerEvent( elem, 'click' );
/**
* Trigger the specified event on the specified element.
* @param {Object} elem the target element.
* @param {String} event the type of the event (e.g. 'click').
*/
function triggerEvent( elem, event ) {
var clickEvent = new Event( event ); // Create the event.
elem.dispatchEvent( clickEvent ); // Dispatch the event.
}
Reference
参考
回答by Adam Salma
You could save yourself a bunch of space by using jQuery. You only need to use:
您可以使用 jQuery 为自己节省大量空间。您只需要使用：
$('#myElement').trigger("click")
回答by brianlmerritt
The top answer is the best! However, it was not triggering mouse events for me in Firefox when etype = 'click'.
最高的答案是最好的！但是，当etype = 'click'.
So, I changed the document.createEventto 'MouseEvents'and that fixed the problem. The extra code is to test whether or not another bit of code was interfering with the event, and if it was cancelled I would log that to console.
因此，我将其更改document.createEvent为'MouseEvents'并解决了问题。额外的代码是为了测试是否有其他代码干扰了事件，如果它被取消，我会将其记录到控制台。
function eventFire(el, etype){
if (el.fireEvent) {
el.fireEvent('on' + etype);
} else {
var evObj = document.createEvent('MouseEvents');
evObj.initEvent(etype, true, false);
var canceled = !el.dispatchEvent(evObj);
if (canceled) {
// A handler called preventDefault.
console.log("automatic click canceled");
} else {
// None of the handlers called preventDefault.
}
}
}
回答by Charlie Pradeep
document.getElementById('elementId').dispatchEvent(new MouseEvent("click",{bubbles: true, cancellable: true}));
Follow this link to know about the mouse events using Javascript and browser compatibility for the same
按照此链接了解使用 Javascript 的鼠标事件和浏览器兼容性
https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent#Browser_compatibility
https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent#Browser_compatibility
