本文已参与「新人创作礼」活动， 一起开启掘金创作之路。
这篇文章是讲 原生js javascript 如何实现trigger（也就是自动触发window 的resize事件）。 一、工作了几年的盆友应该都知道 jQuery有个 trigger 方法，可以触发被选元素的指定事件类型。
虽然现在jquery不怎么用了，但是不得不说，它里面有些方法还是不错的，比如这篇文章要讲的trigger事件。
既然不用jq，那么在原生js中怎么实现 trigger 的方法呢？我们先来看看代码：
<button id="btn-1">Button-1</button>
<button id="btn-2">Button-2</button>
<script>
// 假如想通过点击 Button-1 触发 Button-2 的某个事件
let btn_1 = document.getElementById('btn-1');
let btn_2 = document.getElementById('btn-2');
btn_1.onclick = function () {
var myEvent = new Event('click');
btn_2.dispatchEvent(myEvent);
}
btn_2.onclick = function () {
alert('OK');
// do something
}
</script>
当然此处的click可以改为你需要触发的事件：
讲了怎么用原生js实现自动触发，那就来看看它的应用场景：
如果我想在不实际改变浏览器窗口大小的情况下触发 window的 resize 事件可不可以呢？（虽然这个描述听起来有些变态，但是有时候项目可能需要重绘图表或者别的需求的时候，这里的方法或许可以帮你解决一些问题） 比如最常见的需求：echarts之类的图表，随着窗口大小的变化需要自适应显示，然而，有时候你按照api上的说明写了自适应的属性，也会出现“失灵”的情况，这个时候如果没有时间仔细研究，可以先自己写个方法应急（但是这不是最佳解决办法，事后最好还是优化一下！）
同样的，先来看看代码：
<button id="btn-1">Button-1</button>
<script>
// 假如想通过点击 Button-1 触发 window 的 resize 事件
let btn_1 = document.getElementById('btn-1');
btn_1.onclick = function () {
var myEvent = new Event('resize');
window.dispatchEvent(myEvent); // 在这里就会触发window的resize事件，如果你监听了window的resize事件，这个时候就会开始执行
}
</script>
最后，希望这篇有点年头的老博客能对您有所帮助！
