JavaScript event [removed] not triggered

2019-03-14 06:40发布

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 onresize works fine, but the onload event never fires. I've tried it in Firefox and Chrome and neither of them works.

Thank you for your help and go for the reputation! ;D

7条回答
该账号已被封号
2楼-- · 2019-03-14 07:20

Move the window.onload line to the end of the javascript file or after the initial function and it will work:

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:

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.

查看更多
我欲成王,谁敢阻挡
3楼-- · 2019-03-14 07:26

I think what's probably happening here is that your window.onload is being overridden later, check to make sure that it's not via things like <body onload="">

You can check this by alert(window.onload) in your re-size function, to see what's actually attached there.

查看更多
仙女界的扛把子
4楼-- · 2019-03-14 07:29

For me, window.onload was not working when wrote inside script type="text/javascript tag.

Instead, needed to write the same in script language="Javascript" type="text/javascript tag and it worked fine.

查看更多
爷的心禁止访问
5楼-- · 2019-03-14 07:32

This will be work when you call the "window.onload" next to the function resize()

查看更多
对你真心纯属浪费
6楼-- · 2019-03-14 07:34

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.

There IS!

window.addEventListener ? 
window.addEventListener("load",yourFunction,false) : 
window.attachEvent && window.attachEvent("onload",yourFunction);

Know that I know that, 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.

Source where I found the fix --> http://ckon.wordpress.com/2008/07/25/stop-using-windowonload-in-javascript/

查看更多
戒情不戒烟
7楼-- · 2019-03-14 07:40

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/

are you sure its the only event called onLoad ? Maybe an other onLoad event creates a conflict

查看更多
登录 后发表回答