效果：點擊手機的返回鍵，出現一個自定義的彈窗（彈窗樣式內容自己做），
<script>
//第一種
jQuery(document).ready(function ($) {
if (window.history && window.history.pushState) {
$(window).on('popstate', function () {
var hashLocation = location.hash;
var hashSplit = hashLocation.split("#!/");
var hashName = hashSplit[1];
if (hashName !== '') {
var hash = window.location.hash;
if (hash === '') {
document.getElementById("myModal").style.display = "block";
}
}
});
window.history.pushState('forward', null, './#forward');
}
});
//第二種
function pushHistory() {
var state = {
title: "title",
url: "#"
};
window.history.pushState(state, "title", "#xx");
}
pushHistory();
window.addEventListener("popstate", function (e) {
console.log(e);
document.getElementById("myModal").style.display = "block";
}, false);
//第三種
pushHistory();
window.addEventListener("popstate", function (e) {
document.getElementById("myModal").style.display = "block";
}, false);
function pushHistory() {
history.pushState({
page: 1
}, "title 1", "#");
}
//第四種
pushHistory();
window.addEventListener("popstate", function (e) {
// 返回彈窗
document.getElementById("modalll").style.display = "block";
// 或者是跳轉到其他頁面
// window.location = 'http://www.baidu.com';
}, false);
function pushHistory() {
var state = {
title: "title",
url: "#"
};
window.history.pushState(state, "title", "#");
}
</script>
！！！！！！！如果實驗效果，點擊一下屏幕，返回彈窗效果觸發，這是再按返回，即可出來彈窗（用戶往下滑時也可觸發）！！！！！！！！！！！
注意：插入JQ
