zoukankan      html  css  js  c++  java
  • 原生js javascript 实现trigger(自动触发window 的resize事件)

    一、大家都知道 jQuery有个 trigger 方法,可以触发被选元素的指定事件类型。 
    那么在原生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>

    二、如果我想在不实际改变浏览器窗口大小的情况下触发 window的 resize 事件可不可以呢?(虽然听起来有些变态,但是有时候你需要重绘图表或者别的需求的时候,这可以帮你解决一些问题)同样的,先上代码:

    <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);
        }
    </script>
    --------------------- 
    作者:一只爱吃糖的小羊 
    来源:CSDN 
    原文:https://blog.csdn.net/janelittle/article/details/81670021 !
  • 相关阅读:
    vue 兼容ie 下载文件
    IDEA maven项目添加自己的jar包依赖
    mongodb 用户权限操作
    springboot + aspect
    Enum枚举类
    线上CPU飙升100%问题排查
    Linux零拷贝技术
    Java线程池实现原理及其在美团业务中的实践
    深入解析String#intern
    Java对象内存布局
  • 原文地址:https://www.cnblogs.com/hjsblogs/p/10337132.html
Copyright © 2011-2022 走看看