h1.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<a href="h2.html">h1 to h2</a>
</body>
</html>
h2.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<h2>h2</h2>
<pre>在当前页面点击浏览器上返回将触发跳转到 h3 页面,并触发 h3 页面 “#h2” 锚点事件 </pre>
</body>
</html>
<script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>
<script>
$(function () {
console.log(" current is h2 ")
})
$(document).ready(function() {
if (window.history && window.history.pushState) {
$(window).on('popstate', function () {
window.location = "h3.html#h2"
});
}
// window.history.pushState('forward', null, '#'); //在IE中必须得有这两行
//window.history.forward(1);
});
</script>
h3.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<a target="frame" id="h1" href="h1.html">frame1</a>
<a target="frame" id="h2" href="h2.html">frame2</a>
<iframe name="frame" class="frame">
</iframe>
</body>
</html>
<script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>
<script>
$(function () {
console.log(" current is h3 ")
console.log(location.hash)
// var tag = location.hash;
// document.getElementById(tag).click();
document.getElementById("h2").click();
})
</script>