如何显示“您确定要离开该页面吗？” 当用户实际上试图关闭页面（单击浏览器窗口或选项卡上的 X 按钮）时，而不是当他试图离开页面时（单击另一个链接）。
我的客户希望在用户尝试关闭页面时显示一条消息“您确定要离开该页面吗？您的购物车中还有商品。”
不幸的是$(window).bind('beforeunload')，仅在用户关闭页面时才触发。
jQuery：
function checkCart() {
$.ajax({
url : 'index.php?route=module/cart/check',
type : 'POST',
dataType : 'json',
success : function (result) {
if (result) {
$(window).bind('beforeunload', function(){
return 'leave?';
});
}
}
})
}
您可以使用JQuery来做到这一点。
例如，_
<a href="your URL" id="navigate"> click here </a>
你的JQuery意愿是，
$(document).ready(function(){
$('a').on('mousedown', stopNavigate);
$('a').on('mouseleave', function () {
$(window).on('beforeunload', function(){
return 'Are you sure you want to leave?';
});
});
});
function stopNavigate(){
$(window).off('beforeunload');
}
并获得离开消息警报将是，
$(window).on('beforeunload', function(){
return 'Are you sure you want to leave?';
});
$(window).on('unload', function(){
logout();
});
该解决方案适用于所有浏览器，我已经对其进行了测试。
在你的 Ajax 中尝试 javascript
window.onbeforeunload = function(){
return 'Are you sure you want to leave?';
};
参考链接
示例 2：
document.getElementsByClassName('eStore_buy_now_button')[0].onclick = function(){
window.btn_clicked = true;
};
window.onbeforeunload = function(){
if(!window.btn_clicked){
return 'You must click "Buy Now" to make payment and finish your order. If you leave now your order will be canceled.';
}
};
每次离开页面时它都会提醒用户，直到他点击按钮。
演示：http: //jsfiddle.net/DerekL/GSWbB/show/
信用应该在这里： 如何检测触发window.onbeforeunload时是否点击了链接？
基本上，该解决方案添加了一个侦听器来检测链接或窗口是否导致 unload 事件触发。
var link_was_clicked = false;
document.addEventListener("click", function(e) {
if (e.target.nodeName.toLowerCase() === 'a') {
link_was_clicked = true;
}
}, true);
window.onbeforeunload = function(e) {
if(link_was_clicked) {
return;
}
return confirm('Are you sure?');
}
如此处所示https://stackoverflow.com/a/1632004/330867，您可以通过“过滤”产生此页面退出的内容来实现它。
正如评论中提到的，这是另一个问题中代码的新版本，其中还包括您在问题中提出的 ajax 请求：
var canExit = true;
// For every function that will call an ajax query, you need to set the var "canExit" to false, then set it to false once the ajax is finished.
function checkCart() {
canExit = false;
$.ajax({
url : 'index.php?route=module/cart/check',
type : 'POST',
dataType : 'json',
success : function (result) {
if (result) {
canExit = true;
}
}
})
}
$(document).on('click', 'a', function() {canExit = true;}); // can exit if it's a link
$(window).on('beforeunload', function() {
if (canExit) return null; // null will allow exit without a question
// Else, just return the message you want to display
return "Do you really want to close?";
});
重要提示：您不应该定义全局变量（此处canExit），此处用于更简单的版本。
请注意，您不能完全覆盖确认消息（至少在 chrome 中）。您返回的消息只会添加到 Chrome 提供的消息之前。原因如下：如何覆盖 OnBeforeUnload 对话框并将其替换为我自己的？
ajax试试这个，通过 return 语句加载数据并显示。
<script type="text/javascript">
function closeWindow(){
var Data = $.ajax({
type : "POST",
url : "file.txt", //loading a simple text file for sample.
cache : false,
global : false,
async : false,
success : function(data) {
return data;
}
}).responseText;
return "Are you sure you want to leave the page? You still have "+Data+" items in your shopping cart";
}
window.onbeforeunload = closeWindow;
</script>