我想alert()
在单击浏览器的后退或前进按钮或在 javascript 中更改哈希时。我已经尝试过这个解决方案并且它正在工作,但它会导致网页中的其他链接出现问题,并在任何链接点击事件上提交每个请求两次。
有什么解决方案可以在不使用setInterval()
函数的情况下捕获它?所以我需要捕获哈希更改或后退/前进按钮单击事件?我需要一个简单的 javascript 代码/函数/属性,它应该适用于所有现代浏览器。
有什么解决办法吗?
谢谢
我想alert()
在单击浏览器的后退或前进按钮或在 javascript 中更改哈希时。我已经尝试过这个解决方案并且它正在工作,但它会导致网页中的其他链接出现问题,并在任何链接点击事件上提交每个请求两次。
有什么解决方案可以在不使用setInterval()
函数的情况下捕获它?所以我需要捕获哈希更改或后退/前进按钮单击事件?我需要一个简单的 javascript 代码/函数/属性,它应该适用于所有现代浏览器。
有什么解决办法吗?
谢谢
你能解释一下这背后的原因吗?我们都走在这条防止后退/前进和类似情况以及破坏浏览器功能的道路上。
事实证明,最好服从浏览器并以这种方式编写您的应用程序,这样这些事情就变得无关紧要了。浏览器将越来越多的东西锁定到客户端 JavaScript 应用程序也是事实,因此您的应用程序很可能会在(少数)浏览器升级后失败。
HTML5 History 规范可能正是您所追求的。这是关于 Ajax 应用程序和浏览器的后退/前进功能的工作和完成方式。我建议你检查一下。查看一个可以很好地做到这一点的工作演示。
我相信这是 Robert Koritnik 正在寻找的答案,我在这里找到了它:https ://developers.google.com/tv/web/articles/location-hash-navigation
每当位置哈希更新或更改时,都会触发一个事件 (window.onhashchange),因此您所要做的就是使用 JavaScript 设置一个事件处理程序来侦听此事件并根据哈希执行代码。这基本上是如何完成的:
function getLocationHash() {
return window.location.hash.substring(1);
}
window.onhashchange = function(e) {
switch(getLocationHash()) {
case 'state1':
execute code block 1;
break;
case 'state2':
execute code block 2;
break;
default:
code to be executed if different from case 1 and 2;
}
}
我有它在我的网站上工作:http: //www.designhandler.com
这都是动态变化的内容。还没有ajax,但是当我完成时它会。我仍然使用 window.location.hash 来跟踪站点状态。如果您浏览站点,然后在站点进入历史记录后开始使用后退按钮进行导航,它将动态更改状态,就像用户实际点击导航一样,而不是之后需要重新加载页面。
这是用于哈希还是用于重定向?你想做什么?这种行为通常是高度侵入性的。
在离开页面之前,您可能想为此 javascript 尝试“onbeforeunload”事件
实际上,您提供的链接非常准确。
var hash = location.hash;
setInterval(function()
{
if (location.hash != hash)
{
hashUpdatedEvent(hash);
}
}, 100);
function hashUpdatedEvent(hash)
{
switch(...);
}
如果您更改,您的链接重复操作问题将得到纠正
<a href="javascript:void(0)" onclick="someFuncion()">Go for it</a>
function someFuncion()
{
doWhatever();
location.hash = 'somethingwasdone';
}
function hashUpdatedEvent(hash)
{
if(hash == 'somethingwasdone')
{
doWhatever();
}
}
只需(更新哈希并让“事件”处理操作):
<a href="javascript:void(0)" onclick="someFuncion()">Go for it</a>
function someFuncion()
{
location.hash = 'somethingwasdone';
}
function hashUpdatedEvent(hash)
{
if(hash == 'somethingwasdone')
{
doWhatever();
}
}
Javascript 提供事件popstate
来捕获浏览器的后退/前进按钮单击事件 -
window.addEventListener("popstate", function(e) {
// if a back or forward button is clicked, do whatever, like alert or anything
console.log('href => ', e.path[0].location.href);
// href => https://testdomain.com/demos/material/admin-app/#!/app/dashboard
console.log('hash => ', e.path[0].location.hash);
//hash => #!/app/dashboard
console.log('pathname => ', e.path[0].location.pathname);
//pathname => /demos/material/admin-app/
});
阅读更多关于popstate