我怎样才能手动触发一个正确的使用Javascript点击？
我可以用 jQuery 做到这一点，但在这种情况下我只能使用纯 Javascript。
使用纯 Javascript 触发右键单击
IT技术
javascript
2021-01-18 02:19:51
3个回答
使用CustomEvent构造函数创建一个事件，或者（当它不受支持时），使用document.createEvent字符串“HTMLEvents”作为参数创建一个事件（因为您要创建一个click事件）。然后，使用该initEvent方法创建一个click事件。
最后，使用dispatchEvent方法来触发事件。如果您使用的是 IE，则fireEvent必须改用该方法。
如果要触发右键单击事件contextmenu，请使用以下代码：
var element = document.getElementById('yourElement');
if (window.CustomEvent) {
element.dispatchEvent(new CustomEvent('contextmenu'));
} else if (document.createEvent) {
var ev = document.createEvent('HTMLEvents');
ev.initEvent('contextmenu', true, false);
element.dispatchEvent(ev);
} else { // Internet Explorer
element.fireEvent('oncontextmenu');
}
另一个变体，这次使用的是更现代的MouseEvent API。就我而言，我实际上发送了所有三个事件 mouseup/mousedown/contextmenu：
var element = document.getElementById("yourElement");
var ev1 = new MouseEvent("mousedown", {
bubbles: true,
cancelable: false,
view: window,
button: 2,
buttons: 2,
clientX: element.getBoundingClientRect().x,
clientY: element.getBoundingClientRect().y
});
element.dispatchEvent(ev1);
var ev2 = new MouseEvent("mouseup", {
bubbles: true,
cancelable: false,
view: window,
button: 2,
buttons: 0,
clientX: element.getBoundingClientRect().x,
clientY: element.getBoundingClientRect().y
});
element.dispatchEvent(ev2);
var ev3 = new MouseEvent("contextmenu", {
bubbles: true,
cancelable: false,
view: window,
button: 2,
buttons: 0,
clientX: element.getBoundingClientRect().x,
clientY: element.getBoundingClientRect().y
});
element.dispatchEvent(ev3);
以 Rob W 为例，我还没有尝试过，但是，您需要制作事件对象并在触发事件时将其传递。对于右键单击传递 event.button = 2;
var element = document.getElementById("yourElement"),
ev;
if(document.createEvent ) {
ev = document.createEvent("MouseEvents");
ev.initMouseEvent("click", true, false, window,0,0,0,0,0,false,false,false,false,2,null);
element.dispatchEvent(ev);
} else {
ev = document.createEventObject();
ev.button = 2;
element.fireEvent('onclick', ev);
}
根据 mdn initMouseEvent 更新。祝你好运 ：）