我想在用户单击浏览器的“后退按钮”时警告用户，然后在确认后将其重定向。下面是我的JS代码，但仅在firefox中有效，我想使其在chrome和其他浏览器中也可以工作。
注意：要在Chrome中触发事件，我需要先单击页面正文，然后单击浏览器的“后退”按钮（这不好）。
请协助。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Page2</title>
</head>
<body>
<script src="https://code.jquery.com/jquery-3.4.1.min.js" integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo="
crossorigin="anonymous"></script>
<script>
$(function(){
window.history.pushState({page: 1}, "", "");
window.onpopstate = function(event) {
if(event){
var confirm = window.confirm("Please, note that you may lose your move details by returning to the previous page.");
}
}
});
</script>
</body>
</html>
我找到了一个有用的链接，该链接解释了Chrome和其他浏览器的这种行为。
"Chrome plans to save you from sites that mess with your back button"
上面的帖子中提到的一些令人讨厌的站点，用途这种行为，对他们有利。因此，看起来像Chrome这样的浏览器正在通过[后退按钮] 故意防止这种偷偷摸摸的骇客（显然是由于安全原因和流畅的用户体验）。另外，我怀疑是否有人发现了漂亮的骇客，然后Chrome开发人员会再次发展他们的安全检查，如文章中所述。
无论如何，我们仍然有Firefox with us。祝你好运;）
这是在使用浏览器后退按钮时可以用来显示警报的解决方案。
要允许浏览器后退按钮，您需要有2个页面，所以我在显示带有2个不同页面的示例-
第一页-
<div id="div1">
<a onclick='next(); return false;' href="#">Link</a>to second page
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"</script>
<script >
function next(){
$("#div1").load("second.html");
history.pushState(null,null,"second.html");
}
</script>
它将使用jquery动态加载div内部第二页的内容
现在在第二页
<h3>This is second page </h3>
<script>
window.addEventListener("popstate", function(e) {
alert("Back button disabled");
history.pushState(null,null,"second.html");
});
</script>
现在，当任何人单击后退按钮时，都会显示警报