离开页面 - 消息出现两次

时间:2021-01-05 01:14:35

I've added this Javascript to my website which detects when the user navigates away from the page, but I only want a warning to appear if the navigator is offline AND one of my elements contains the word "unsaved":

我已将此Javascript添加到我的网站,该网站会检测用户何时离开页面,但我只想在导航器处于离线状态时出现警告并且我的某个元素包含“未保存”字样:

window.thisPage = window.thisPage || {};
window.thisPage.closeEditorWarning = function (event) {
 if (navigator.onLine===false) {
  // See if any fields need saving...
  for (i = 1; i <= 500; i++) { 
   try {
    ToSave = document.getElementById("Q" + i).innerHTML;
    if (ToSave.indexOf("unsaved")!=-1) {
     return "You are currently offline and some of your responses are not yet saved.\r\n\r\nIf you want to save the changes you've made, choose to 'Stay on this Page' and then reconnect to the internet and any unsaved responses will save automatically.";
    }
   }
   catch(err) {  }
   // If got this far, nothing needs saving anyway...
  }
 }
 return undefined;
};

window.onbeforeunload = window.thisPage.closeEditorWarning;

The code works fine except; if the message pops up the first time and I choose "Stay on this page", then try to navigate away again and the second time click "Leave this page" - rather than navigating away it displays the message again but I can't work out why.

代码工作正常,除了;如果第一次弹出消息,我选择“留在此页面上”,然后再次尝试导航,第二次点击“离开此页面” - 而不是导航它再次显示消息,但我无法工作为什么。

1 个解决方案

#1


0  

Try returning true from your catch, so the unload will execute. You can also remove the return undefined; from the end.

尝试从catch中返回true,因此卸载将执行。你也可以删除return undefined;从最后。

This works for me, is this what you're after?

这对我有用,这就是你要追求的吗?

This works for me in Firefox.

这适用于Firefox。

Fiddle: http://jsfiddle.net/518myq0j/3/ (clicking 'Run' triggers the onbeforeunload)

小提琴:http://jsfiddle.net/518myq0j/3/(点击'Run'触发onb​​eforeunload)

Updated JavaScript code:

更新的JavaScript代码:

window.thisPage = window.thisPage || {};

window.thisPage.closeEditorWarning = function (event) {
    if (navigator.onLine === false) {
        // See if any fields need saving...
        for (i = 1; i <= 5; i++) {
            try {
                var ToSave = document.getElementById("Q" + i).innerHTML;
                if (ToSave.indexOf("unsaved") != -1) {
                    return "You are currently offline and some of your responses are not yet saved.\r\n\r\nIf you want to save the changes you've made, choose to 'Stay on this Page' and then reconnect to the internet and any unsaved responses will save automatically.";
                }
            } catch (err) {
                return true;
            }
        }
    }
};

window.onbeforeunload = window.thisPage.closeEditorWarning;

#1


0  

Try returning true from your catch, so the unload will execute. You can also remove the return undefined; from the end.

尝试从catch中返回true,因此卸载将执行。你也可以删除return undefined;从最后。

This works for me, is this what you're after?

这对我有用,这就是你要追求的吗?

This works for me in Firefox.

这适用于Firefox。

Fiddle: http://jsfiddle.net/518myq0j/3/ (clicking 'Run' triggers the onbeforeunload)

小提琴:http://jsfiddle.net/518myq0j/3/(点击'Run'触发onb​​eforeunload)

Updated JavaScript code:

更新的JavaScript代码:

window.thisPage = window.thisPage || {};

window.thisPage.closeEditorWarning = function (event) {
    if (navigator.onLine === false) {
        // See if any fields need saving...
        for (i = 1; i <= 5; i++) {
            try {
                var ToSave = document.getElementById("Q" + i).innerHTML;
                if (ToSave.indexOf("unsaved") != -1) {
                    return "You are currently offline and some of your responses are not yet saved.\r\n\r\nIf you want to save the changes you've made, choose to 'Stay on this Page' and then reconnect to the internet and any unsaved responses will save automatically.";
                }
            } catch (err) {
                return true;
            }
        }
    }
};

window.onbeforeunload = window.thisPage.closeEditorWarning;