有时候,我们需要代码自动触发对应的事件,而不需要人为操作。比如,一个按钮的点击事件,不要点击它,而让它自动执行。
首先定义事件,先按照传统的 onclick 方式来。(这里以点击某个标签事件为梨)
var xx = document.getElementById("xx");
xx.onclick = function(){
alert( this.innerHTML );
}
触发事件:
xx.click(); // IE8+,chrome,FF
也可以:
xx.onclick();
但是这种方式的本质是执行 onclick指向的函数。
如果用 addEventListener 来添加事件 , xx.onclick() 这种方式就无法触发事件代码执行。
综上,要触发事件,就使用类似 xx.click() 就行了。
----------------2019.8.4 更新 -----------------
经过查阅资料,通过代码自动触发事件,还是用以下类似的代码更科学:
代码触发事件:
<button id="mybtn">按钮</button>
<script>
let btn = document.getElementById("mybtn");
btn.addEventListener("mouseenter",function(){
console.info("事件发生!");
});
// 不通过鼠标,自动 mouseenter 事件。其他事件也类推。
let ev = new Event("mouseenter");
btn.dispatchEvent(ev);
</script>
new Event() 是创建一个事件对象。通过 标签 的 dispatchEvent 方法可以触发该事件。