原生js实现jquery中的trigger
一、总结
一句话总结：
jquery中trigger什么的click事件，相当于js中new Event('click')，然后dispatchEvent
<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>
二、原生js实现jquery中的trigger
转自或参考：原生js javascript 实现trigger（自动触发window 的resize事件）
https://blog.csdn.net/janelittle/article/details/81670021
一、大家都知道 jQuery有个 trigger 方法，可以触发被选元素的指定事件类型。
那么在原生js中怎么实现 trigger 的方法呢？
首先上代码：
1 <button id="btn-1">Button-1</button> 2 <button id="btn-2">Button-2</button> 3 <script> 4 // 假如想通过点击 Button-1 触发 Button-2 的某个事件 5 let btn_1 = document.getElementById('btn-1'); 6 let btn_2 = document.getElementById('btn-2'); 7 btn_1.onclick = function () { 8 var myEvent = new Event('click'); 9 btn_2.dispatchEvent(myEvent); 10 } 11 btn_2.onclick = function () { 12 alert('OK'); 13 // do something 14 } 15 </script>
二、如果我想在不实际改变浏览器窗口大小的情况下触发 window的 resize 事件可不可以呢？（虽然听起来有些变态，但是有时候你需要重绘图表或者别的需求的时候，这可以帮你解决一些问题）同样的，
先上代码：
1 <button id="btn-1">Button-1</button> 2 <script> 3 // 假如想通过点击 Button-1 触发 window 的 resize 事件 4 let btn_1 = document.getElementById('btn-1'); 5 btn_1.onclick = function () { 6 var myEvent = new Event('resize'); 7 window.dispatchEvent(myEvent); 8 } 9 </script>