我想编写一个JavaScript代码,该代码可以在window.onpopstate或window.onload上执行某项操作,但绝不会执行两次(请注意,chrome在onload和单击后退导航按钮时都会触发popstate事件)
我希望它与主要的现代浏览器兼容(IE10 firefox chrome Opera safari)
而且我宁愿不使用任何库-甚至不使用jquery。
这样的事情(但是当然使用正确的语法):
window.onload || window.onpopstate = function(){
window.alert("hello world");
}
谢谢
编辑1
根据您的建议,我尝试了以下方法:
var ranAlready=false;
window.onload = function(){
if (!ranAlready){
window.alert("onload was true");
ranAlready=true;
}
};
window.onpopstate = function(){
if (!ranAlready){
window.alert("popstate was true");
ranAlready=true;
}
};
但是现在我不确定如何将变量设置回false。因为它取决于浏览器等等。
编辑2
我需要它不止一次地工作,因为用户可能会单击一些Ajax链接,因此页面不会刷新,但是URL会更改,因此他可能会单击“后退”按钮。这意味着该变量必须在某个时刻设置回false /但我不知道何时。
最佳答案
问题是在Chrome中,“ popstate”事件是在页面加载时触发的,因此处理程序将运行两次。您可以通过在popstate上运行时检查历史记录状态以检测其是否在初始加载时运行来解决此问题。
function showAlert() {
window.alert("hello world");
}
function showAlertOnPopState(){
if (window.history.state == null){ // This means it's page load
return;
}
showAlert();
}
window.onload = showAlert;
window.onpopstate = showAlertOnPopState;
小提琴:http://jsfiddle.net/ER8zC/2/
在此处找到history.state技巧:Popstate on page's load in Chrome