42 javascript onload onload-event
我在网站上有以下代码:
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;
}
该onresize工程罚款,但onload事件永远不会触发.我已经在Firefox和Chrome中尝试过,但它们都不起作用.
感谢您的帮助,并获得声誉!; d
Nic*_*ver 79
我认为这里可能发生的事情是你window.onload的被淘汰之后,检查以确保它不是通过像<body onload="">
您可以alert(window.onload)在重新调整大小的功能中查看,以查看实际附加的内容.
All*_*rff 24
当我添加合作伙伴所需的第三方jQuery代码时,我就发生了这种情况.我可以轻松地将我过时的window.onload转换为jQuery文档.也就是说,我想知道是否有现代的跨浏览器兼容解决方案.
有!
window.addEventListener ?
window.addEventListener("load",yourFunction,false) :
window.attachEvent && window.attachEvent("onload",yourFunction);
知道我知道,我可以将我的代码转换为使用jQuery路由.并且,我会要求我们的合作伙伴重构他们的代码,以便他们不再影响网站.
我找到修复的来源 - > http://ckon.wordpress.com/2008/07/25/stop-using-windowonload-in-javascript/
这个答案是针对那些因为 window.onload 没有触发而来到这里的人。
我发现以下内容可以工作
window.onload = myInitFunction;
或者
window.addEventListener("load", myInitFunction);
引用的函数（本例中为 myInitFunction）必须驻留在（或定义）在同一个 <script> 元素中，或者位于建立 onload 事件的 <script> 元素之前出现的 <script> 元素中。否则它将无法工作。
所以，这是行不通的：
<html>
<head>
<title>onload test</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script>
window.addEventListener("load", myInitFunction)
</script>
<script>
function myInitFunction() {
alert('myInitFunction');
}
</script>
</head>
<body>
onload test
</body>
</html>
但这会起作用：
<html>
<head>
<title>onload test</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script>
function myInitFunction() {
alert('myInitFunction');
}
</script>
<script>
window.addEventListener("load", myInitFunction)
</script>
</head>
<body>
onload test
</body>
</html>
这将会起作用（因为我们只有一个 <script> 元素）：
<html>
<head>
<title>onload test</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script>
window.addEventListener("load", myInitFunction)
function myInitFunction() {
alert('myInitFunction');
}
</script>
</head>
<body>
onload test
</body>
</html>
如果由于某种原因您有两个 <script> 元素并且不能（或不想）合并它们，并且您希望将 onload 定义在较高位置（即在第一个元素中），那么您可以通过以下方式解决它
而不是写作
window.onload = myInitFunction;
你写
window.onload = function() { myInitFunction() };
或者，而不是写
window.addEventListener("load", myInitFunction);
你写
window.addEventListener("load", function() { myInitFunction() });
解决这个问题的另一种方法是使用旧的
<body onload="myInitFunction()">
将 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;
但如果您不更换 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);
这对我有用，对我的英语很抱歉。
| 归档时间： |
|
| 查看次数： |
72359 次 |
| 最近记录： |