在 window.onload 中添加两个函数

IT技术 javascript function
2021-01-27 02:43:51

我的表单上有两个功能，但如果另一个功能处于活动状态，则其中一个功能不起作用。这是我的代码：

window.onload = function(event) {
    var $input2 = document.getElementById('dec');
    var $input1 = document.getElementById('parenta');
    $input1.addEventListener('keyup', function() {
        $input2.value = $input1.value;
    });
}

window.onload=function(){
    document.getElementById('enable').onchange=function(){
        var txt = document.getElementById('gov1');
        if(this.checked) txt.disabled=false;
        else txt.disabled = true;
    };
};

我的意思是，当我的表单中有这两个函数时，第二个函数可以正常工作，但第一个函数不起作用，如果取出第二个函数，第一个函数会正常工作，为什么会发生这种情况？是因为名字吗？

6个回答
window.addEventListener("load",function(event) {
    var $input2 = document.getElementById('dec');
    var $input1 = document.getElementById('parenta');
    $input1.addEventListener('keyup', function() {
        $input2.value = $input1.value;
    });
},false);

window.addEventListener("load",function(){
    document.getElementById('enable').onchange=function(){
        var txt = document.getElementById('gov1');
        if(this.checked) txt.disabled=false;
        else txt.disabled = true;
    };
},false);

文档在这里

请注意，此解决方案可能无法跨浏览器工作。我认为你需要依赖第三个库，比如 jquery$(document).ready

+1但是，他addEventListener已经在他的代码中使用了，所以这个解决方案是公平的。
2021-04-12 02:43:51
+1 下面的回答如扩展或特定于 IE 可能满足跨浏览器支持，如果 vanilla JS 实现是有利的。如果IE10等浏览器支持addEventListener就简单了，就是在默认句柄onload、onReadyStateChange、readystatechange的基础上增加更多的EventListener，不会影响使用第三方脚本。希望我们以后不会出现这种规格不匹配的问题。
2021-04-13 02:43:51

如果由于某种原因您无法组合这些功能，但您可以控制其中一个功能，则可以执行以下操作：

window.onload = function () {
    // first code here...
};

var prev_handler = window.onload;
window.onload = function () {
    if (prev_handler) {
        prev_handler();
    }
    // second code here...
};

以这种方式，两个处理程序都被调用。

我收到Uncaught RangeError: Maximum call stack size exceeded错误:(
2021-03-23 02:43:51
我也遇到了堆栈溢出错误。我相信问题是 prev_handler 最终指向 window.onload 函数本身，它又调用 prev_handler 调用 window.onload 函数。尝试制作一个双委托，如stackoverflow.com/questions/12213234/...
2021-04-03 02:43:51
这就是我要做的方式。+1
2021-04-13 02:43:51

尝试将所有代码放入相同的 [并且只有 1] 个 onload 方法中！

 window.onload = function(){
        // All code comes here 
 }
我不能这样做，因为我的 onLoad 函数是动态回显的... =/
2021-03-16 02:43:51
发生这种情况时，您可能需要重构代码，其中一个所谓的注册表获取所有函数，然后输出一个调用其他函数的函数
2021-03-24 02:43:51

您不能将两个不同的功能分配给window.onload。最后一个永远是赢家。这解释了为什么如果您删除最后一个，第一个开始按预期工作。

看起来您应该将第二个函数的代码合并到第一个函数中。

window.addEventListener 在 IE 中不起作用，所以使用 window.attachEvent

你可以做这样的事情

function fun1(){
    // do something
}

function fun2(){
    // do something
}


var addFunctionOnWindowLoad = function(callback){
      if(window.addEventListener){
          window.addEventListener('load',callback,false);
      }else{
          window.attachEvent('onload',callback);
      }
}

addFunctionOnWindowLoad(fun1);
addFunctionOnWindowLoad(fun2);
工作正常 > 在 chrome 上测试
2021-04-05 02:43:51
其它你可能感兴趣的问题
上一篇webkit 中的意外令牌非法 下一篇如何在 React 的 UseEffect() 中调用异步函数？