JavaScript 事件 window.onload 未触发
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/2810825/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
JavaScript event window.onload not triggered
提问by Nick Craver
I've got the following code in a website:
我在一个网站上有以下代码:
window.onload = resize;
window.onresize = resize;
function resize(){
heightWithoutHeader = (window.innerHeight - 85) + "px";
document.getElementById("main-table").style.height = heightWithoutHeader;
document.getElementById("navigation").style.height = heightWithoutHeader;
}
The onresizeworks fine, but the onloadevent never fires. I've tried it in Firefox and Chrome and neither of them works.
该onresize工作正常,但该onload事件永远不会触发。我已经在 Firefox 和 Chrome 中尝试过,但它们都不起作用。
Thank you for your help and go for the reputation! ;D
感谢您的帮助,并为声誉而努力!;D
回答by Nick Craver
I think what's probably happening here is that your window.onloadis being overridden later, check to make sure that it's not via things like <body onload="">
我认为这里可能发生的事情是您window.onload稍后被覆盖,请检查以确保它不是通过诸如<body onload="">
You can check this by alert(window.onload)in your re-size function, to see what's actually attached there.
您可以alert(window.onload)在重新调整大小功能中检查这一点,以查看实际附加的内容。
回答by Allen Hurff
I had this happen when I added 3rd party jQuery code we needed for a partner. I could have easily converted my antiquated window.onload to a jQuery document ready. That said, I wanted to know if there is a modern day, cross browser compatible solution.
当我为合作伙伴添加我们需要的 3rd 方 jQuery 代码时,我遇到了这种情况。我可以轻松地将过时的 window.onload 转换为准备好的 jQuery 文档。也就是说,我想知道是否有现代的、跨浏览器兼容的解决方案。
There IS!
有!
window.addEventListener ?
window.addEventListener("load",yourFunction,false) :
window.attachEvent && window.attachEvent("onload",yourFunction);
Now that I know ... I can convert my code to use the jQuery route. And, I will ask our partner to refactor their code so they stop affecting sites.
现在我知道了……我可以将我的代码转换为使用 jQuery 路由。而且,我会要求我们的合作伙伴重构他们的代码,以便他们停止影响网站。
Source where I found the fix --> http://ckon.wordpress.com/2008/07/25/stop-using-windowonload-in-javascript/
我找到修复程序的来源 --> http://ckon.wordpress.com/2008/07/25/stop-using-windowonload-in-javascript/
回答by august0490
Move the window.onload line to the end of the javascript file or after the initial function and it will work:
将 window.onload 行移动到 javascript 文件的末尾或初始函数之后,它将起作用:
function resize(){
heightWithoutHeader = (window.innerHeight - 85) + "px";
document.getElementById("main-table").style.height = heightWithoutHeader;
document.getElementById("navigation").style.height = heightWithoutHeader;
}
// ...
// at the end of the file...
window.onload = resize;
window.onresize = resize;
But it's a best practice if you don't replace the onload too. Instead attach your function to the onload event:
但如果您不更换 onload 也是最佳实践。而是将您的函数附加到 onload 事件:
function resize(){
heightWithoutHeader = (window.innerHeight - 85) + "px";
document.getElementById("main-table").style.height = heightWithoutHeader;
document.getElementById("navigation").style.height = heightWithoutHeader;
}
// ...
// at the end of the file...
window.addEventListener ?
window.addEventListener("load",resize,false)
:
window.attachEvent && window.attachEvent("onload",resize);
That worked for me and sorry for my english.
这对我有用,对我的英语很抱歉。
回答by theUltimateWinner
For me, window.onloadwas not working when wrote inside script type="text/javascripttag.
对我来说,window.onload在script type="text/javascript标签内写入时不起作用。
Instead, needed to write the same in script language="Javascript" type="text/javascripttag and it worked fine.
相反,需要在script language="Javascript" type="text/javascript标签中编写相同的内容并且它工作正常。
回答by meo
This works for me, i think your problem is somewhere else:
这对我有用,我认为您的问题出在其他地方:
function resize(){
var tester = document.getElementById("tester"),
html = tester.innerHTML
tester.innerHTML = html + "resize <br />"
}
window.onload = resize;
window.onresize = resize;
you can test it yourself here: http://jsfiddle.net/Dzpeg/2/
你可以在这里自己测试:http: //jsfiddle.net/Dzpeg/2/
are you sure its the only event called onLoad ? Maybe an other onLoad event creates a conflict
你确定它是唯一一个叫做 onLoad 的事件吗?也许其他 onLoad 事件会产生冲突
回答by Prabhu M
This will be work when you call the "window.onload" next to the function resize()
当您调用函数 resize() 旁边的“window.onload”时,这将起作用
回答by Syntactic
If it's really in that order, it's definitely not going to work. You can't assign a function to an event handler before the function itself is declared.
如果真的按照这个顺序,那肯定是行不通的。在声明函数本身之前,您不能将函数分配给事件处理程序。

