Javascript 如何防止通过浏览器按钮而不是链接进行导航？

我希望通过关闭浏览器或使用浏览器的历史记录按钮来警告用户是否离开页面：

但我的链接和按钮在我的网站上应该工作，无论这一点。我怎样才能做到这一点

var linkClicked = false;
window.onbeforeunload = function(e) {
    if (!linkClicked){
        linkClicked = false;
        return 'Ask user a page leaving question here'; 
    }
};

$(document).ready(function(){
    $('a').click(function(e){
        linkClicked = true;
    });
});

显然，这依赖于JQuery将事件处理程序添加到所有链接中，但是您可以使用任何其他方法附加该处理程序，包括将

onclick=“linkClicked=true；”“

添加到页面上的每个链接（如果确实需要）

编辑：

我只想指出，如果用户单击了一个没有重定向它们的链接（例如，指向页面上其他地方的标签链接，或者返回false/阻止执行默认操作的内容），那么这会将linkClicked设置为true，随后不会捕获任何基于浏览器的导航

如果您想了解这一点，我建议在链接上设置一个超时，如下所示：

$(document).ready(function(){
    $('a').click(function(e){
        linkClicked = true;
        setTimeout(function(){
            linkClicked = false;
        }, 500);
    });
});

这将允许在重置标志之前触发半秒钟的窗口卸载事件，以便正确捕获未来的导航事件。这仍然不是完美的，但可能不需要

显然，这依赖于JQuery将事件处理程序添加到所有链接中，但是您可以使用任何其他方法附加该处理程序，包括将

onclick=“linkClicked=true；”“

添加到页面上的每个链接（如果确实需要）

编辑：

我只想指出，如果用户单击了一个没有重定向它们的链接（例如，指向页面上其他地方的标签链接，或者返回false/阻止执行默认操作的内容），那么这会将linkClicked设置为true，随后不会捕获任何基于浏览器的导航

如果您想了解这一点，我建议在链接上设置一个超时，如下所示：

$(document).ready(function(){
    $('a').click(function(e){
        linkClicked = true;
        setTimeout(function(){
            linkClicked = false;
        }, 500);
    });
});

---

这将允许在重置标志之前触发半秒钟的窗口卸载事件，以便正确捕获未来的导航事件。这仍然不是完美的，但可能不需要完美。

首先想到的方法是设置一个变量，告诉您是否单击了链接：

var linked = false;

window.onbeforeunload = function(e) {
    if (!linked)
        return 'Ask user a page leaving question here'; 
};

document.addEventListener('click', function(e) {
    if (e.target.tagName === "A")
        linked = true;
}, false);

---

也就是说，在文档级别设置一个click事件处理程序，该处理程序测试单击的元素是否是锚（或者您希望允许的任何其他元素），如果是，则设置变量。（显然，这假设您没有其他较低级别的锚元素单击处理程序来停止事件传播。）

想到的第一种方法是设置一个变量，告诉您是否单击了链接：

var linked = false;

window.onbeforeunload = function(e) {
    if (!linked)
        return 'Ask user a page leaving question here'; 
};

document.addEventListener('click', function(e) {
    if (e.target.tagName === "A")
        linked = true;
}, false);

---

也就是说，在文档级别设置一个click事件处理程序，该处理程序测试单击的元素是否是锚（或者您希望允许的任何其他元素），如果是，则设置变量。（显然，这假设您没有其他较低级别的锚元素单击处理程序来停止事件传播。）

您可以使用

窗口.onbeforeunload

事件

var check= false;

window.onbeforeunload = function () {
   if (!check) {
   return "Are you sure you want to leave this page?"
   }
}

function CheckBackButton() {
    check= true;
} 



referenceElement.addEventListener('onClick', CheckBackButton(), false);

---

您可以使用

窗口.onbeforeunload

事件

var check= false;

window.onbeforeunload = function () {
   if (!check) {
   return "Are you sure you want to leave this page?"
   }
}

function CheckBackButton() {
    check= true;
} 



referenceElement.addEventListener('onClick', CheckBackButton(), false);

---

给我们确认提示没有？ 像这样

---

给我们确认提示没有？ 像这样

---

这可能会解决您的问题如何

这可能会解决您的问题如何

将单击事件附加到终止它的锚<代码>window.onbeforeunload=null将单击事件附加到终止该事件的锚<代码>window.onbeforeunload=nullOP已经在使用处理程序；问题就在这里。问题是没有显示页面以外的某些路径的弹出窗口。啊，好吧，我误解了这个问题！我的错@nnnnnn搞定了；）OP已经在使用处理程序；问题就在这里。问题是没有显示页面以外的某些路径的弹出窗口。啊，好吧，我误解了这个问题！我的错@nnnnnn搞定了；）