Question

我有以下代码，当我点击关闭（X）按钮时，它显示存储在变量s中的错误。在脚本运行良好之前，但是当我点击关闭按钮时它现在没有显示警报。我在编码时是否有任何错误，或者我需要添加一些.js文件才能使用。

var internalLink = false;

function pageUnload() {
    if (!internalLink && location.protocol != 'http:') {
        internalLink = true;
        var s = 'Alert Message';
        if (navigator.userAgent.indexOf("Firefox") > -1) {
            alert(s);
        }
        setTimeout("location.href= 'foo.com'", 100);
        return s;
    }
}
window.onbeforeunload = pageUnload;

或者您可以提供一些其他代码，以便用户点击关闭按钮时。浏览器将显示存储在变量s中的警报。注意：仅在单击关闭时显示警报，而在重定向到其他链接或提交表单时不显示。单击内部链接时不应显示任何警告。

Answer 1

您的代码中存在多个问题

1）不要将字符串传递给setTimeout而是一个函数

错误：

setTimeout("location.href= 'foo.com'", 100);

正确的：

setTimeout(function(){location.href= 'foo.com'}, 100);

2）根据HTML5 spec，允许在onbeforeunload事件中忽略警报调用（显然FF正在执行）。

3）在卸载事件中也不允许重定向。

您只能返回一个字符串，然后提示给用户（询问他们是否真的要离开页面）。该事件是可取消的，但您无法在事件本身内重定向。

https://developer.mozilla.org/en-US/docs/Web/API/window.onbeforeunload

Answer 2

浏览器很少允许onbeforeunload这样做。哎呀，并非所有人都支持它。我很确定Opera没有。

此活动的目的是显示一个确认框，询问您是否要离开。而已。您无法调用alert或confirm，重定向用户，进行（异步）AJAX调用，或执行大量其他操作。

你可以做的是返回一个字符串。返回的字符串将显示在浏览器呈现的警报上，询问您是否要离开。注意：Firefox实际上不会显示您的字符串（请参阅错误＃588292）。

var internalLink = false;

function pageUnload() {
    if (!internalLink && location.protocol != 'http:') {
        internalLink = true;
        var s = 'Alert Message';
        // You cannot alert or set location.href here

        // This will show your message in a confirm popup
        return s;
    }
}
window.onbeforeunload = pageUnload;

因此，正如您所看到的，浏览器对于它们如何处理甚至触发onbeforeunload非常挑剔。请谨慎使用。

没有“官方”方式知道用户是否点击了“离开”或“停留”。事实上的方法是使用unload事件和setTimeout，但这非常hacky。

var internalLink = false,
    stayTimeout, stayClicked;

function pageUnload() {
    if(stayClicked){
        // Don't run this multiple times
        return;
    }

    if (!internalLink && location.protocol != 'http:') {
        internalLink = true;
        // To mark that we've ran this event once
        stayClicked = true;
        // If the user opted to stay, this will be ran
        setTimeout(stayOnPage, 1000);

        var s = 'Alert Message';
        // You cannot alert or set location.href here

        // This will show your message in a confirm popup
        return s;
    }
}

function stayOnPage(){
    // The user opted to stay, do something
    location.href= 'foo.com';

    // If you are not going to redirect, set stayClicked to false
    // otherwise leave it alone
    // stayClicked = false;
}
function leavePage(){
    // The user has chosen to leave the page, clear the timeout
    clearTimeout(stayTimeout);
}

window.onbeforeunload = pageUnload;
window.unload = leavePage;

很多更好的解决方案是将事件分配给<a>标记，使用您自己的confirm框，然后执行任何操作。< / p>

var a = document.getElementsByTagName('a');
for(var b in a){
    a[b].addEventListener('click', function(e){
        var c = confirm('Do you want to follow this link?');

        if(c){
            // The user wants to leave, let them
            return true;
        }
        else{
            // Otherwise block the link, and do whatever
            e.preventDefault();

            location.href= 'foo.com';
        }
    });
}

单击关闭按钮时的Javascript警报

2 个答案: