经验教程

js使用window.onload覆盖问题的解决方法

悠悠楠杉

2022-09-14

0 评论

994 阅读

正在检测是否收录...

09/14

解决多人开发时，同时使用window.onload事件所出现的后面的window.onload函数覆盖前面一个window.onload函数的问题。

<script>
    // 第一种，使用addEventListener
    window.onload = function () {
        console.log("第一次调用");
    }

    function twofunction() {
        console.log("第二次调用");
    }
    window.addEventListener("load",twofunction);

    // 第二种，封装window.onload，使用addLoadEvent，但直接使用window.onload还是会被替换的
    function addLoadEvent(func) {
        var oldonload = window.onload;
        if (typeof window.onload != 'function') {
            window.onload = func;
        } else {
            window.onload = function () {
                oldonload();
                func();
            }
        }
    }

    //测试
    addLoadEvent(function () { console.log(1) });
    addLoadEvent(function () { console.log(2) });
    addLoadEvent(function () { console.log(3) });

    // window.onload = function () { console.log(4) }// 上面的addLoadEvent会被替换
</script>

经验 js window.onload 覆盖问题

朗读