window.onload 沒辦法運行解决方法

window.onload 沒辦法運行
一个在window.onload可以运行,可是用两个就没办法运行
要怎么修改?

<html>
<head>
<script type="text/javascript">
window.onload = function(){
    document.getElementById("a").onkeyup = function(){
     if (isNaN(this.value.valueOf()) || this.value == "" || this.value < 0 || this.value.indexOf(" ")!=-1)  {
       alert("请输入正确数字!");
   return false;
    }
        if(!isNaN(this.value) && this.value != ""){
if(this.value <= 100 ){
document.getElementById("atotal").innerHTML = "";
}
if(this.value >= 100 ){
document.getElementById("atotal").innerHTML = (parseInt(this.value, 10)  + 10);
}

        }else{
            document.getElementById("atotal").innerHTML = "";
        }
    };

};

window.onload = function(){
    document.getElementById("b").onkeyup = function(){
     if (isNaN(this.value.valueOf()) || this.value == "" || this.value < 0 || this.value.indexOf(" ")!=-1)  {
       alert("请输入正确数字!");
   return false;
    }
        if(!isNaN(this.value) && this.value != ""){
if(this.value <= 500 ){
document.getElementById("btotal").innerHTML = "";
}
if(this.value >= 500 ){
document.getElementById("btotal").innerHTML = (parseInt(this.value, 10)  + 10);
}
        }else{
            document.getElementById("btotal").innerHTML = "";
        }
    };

};

</script>
<body>
<input type="text" id="a" /><span id="atotal"></span>
<input type="text" id="b" /><span id="btotal"></span>
</body>
</html>

------解决方案--------------------
window.onload 是个属性。
addEventListener
------解决方案--------------------
同一个js文件中,若果有多个window.onload = function(){...},后面的的window.onload = function(){...}会覆盖前面的window.onload = function(){...}。遇到这种情况通常是项目协作开发,每个人都写自己的window.onload = function(){...},整合到一起就有多个window.onload = function(){...};或者你是直接拷贝别人的源码到一起的。

通常在实际开发中,我们不会使用window.onload = function(){...},因为这种加载模式需要等待图片之类的大型元素加载完毕后才能执行JS代码。所以,最头疼的就是网速较慢的情况下,页面已经全面展开,图片还在缓慢加载,这时页面上任何的JS交互功能全部处在假死状态。

如果你对jQuery有了解,建议使用$(function(){...});加载模式,这种模式可以多次执行,后面的$(function(){...});不会覆盖前面的$(function(){...});