在javascript中手动执行事件

do events manually in javascript

本文关键字：执行 事件 javascript      更新时间：2023-09-26

是否可以手动执行DOM事件？例如，如果你有一个链接，并想通过代码调用它的默认事件函数：

<a href="one.html" id="a">main page<'a>

document.getElementById("a").onclick();

查看initMouseEvent

创建鼠标事件后初始化该事件的值（通常使用document.createEvent方法.

实时演示

var event = document.createEvent("MouseEvents"),
    anchor = document.querySelector('a');
event.initMouseEvent("click", true, 
                     true, window, 0,
                     0, 0, 0, 0, false,
                     false, false, false,0, null);
anchor.dispatchEvent(event);

MDN以及提供的示例

您可以按照的方式

document.getElementById("a").onclick=function(){f1()};
function f1()
       {
   document.getElementById("demo").innerHTML=3;
       }

使用类似以下的触发事件

var triggerEvent = function (element, name, data) {
var event;
if (window.CustomEvent) {
    event = new CustomEvent(name, {
        detail: data || {},
        bubbles: true,
        cancelable: true
    });
} else {
    event = document.createEvent("Event");
    event.initEvent(name, true, true);
    event.detail = data;
}
element.dispatchEvent(event);
 };

你会像一样使用它

 triggerEvent(input, 'change', {changedText : "Custom data here in this Object"}

根据配置，您可能会得到以下错误

Refused to display 'https://www.some.com/?gfe_rd=cr&ei=50JbU_yHKdGQiAec9IH4Bg' in a frame because it set 'X-Frame-Options' to 'SAMEORIGIN'.

jQuery可以很好地完成您想要的操作：

http://api.jquery.com/click/

$("#a").click();

这将自动调用href和附加到匹配元素的dom事件。

相关文章：