在 javascript 中，当网页未最小化或打开新选项卡时，清除超时前的计时器

Clear a timer before timeout in javascript when the webpage is not minimized or new tab is opened

本文关键字：选项超时计时器清除新选项网页 javascript 最小化更新时间：2023-09-26

我在JavaScript中有一个递归类型函数onload，它像这样运行：我已将弹出窗口的超时设置为 5 秒，这工作正常。但是我想清除计时器并在用户移动到新选项卡时关闭弹出窗口，所以我在 JavaScript 中使用了"document.hidden"属性但是当我运行脚本并移动到新选项卡或最小化浏览器中的窗口时，计时器仍未清除，超时继续 5 秒我错过了什么.请指教

function callMe()
  {
   var delay ;
 $("#dialog").dialog({
        modal: true,
        title: "Confirmation Window1",
        resizable: false,
        width: 300,
        height: 150,
        open: function (event, ui) {
               delay = setTimeout(function () {$("#dialog").dialog("close"); setTimeout(callMe,1000); }, 5000);
                  if(document.hidden) 
                    {
                    clearTimeout (delay);
                    $(this).dialog("close");
                    setTimeout(callMe,1000)
                    }
        },
        buttons: {
            Ok: function () {
                $(this).dialog("close"); //closing on Ok
                clearTimeout (delay);
                setTimeout(callMe,1000)
            },
            Cancel: function () {
                $(this).dialog("close"); //closing on Cancel
                clearTimeout (delay);
                setTimeout(callMe,1000)
            }
        }
    });

我能够通过使用window.blur和window.focus来解决这个问题。代码如下：

 var delay ;
 function callMe()
  {

 $("#dialog").dialog({
        modal: true,
        title: "Confirmation Window1",
        resizable: false,
        width: 300,
        height: 150,
        open: function (event, ui) {
               delay = setTimeout(function () {$("#dialog").dialog("close"); setTimeout(callMe,1000); }, 2000);
        },
        buttons: {
            Ok: function () {
                $(this).dialog("close"); //closing on Ok
                clearTimeout (delay);
                setTimeout(callMe,1000);
            },
            Cancel: function () {
                $(this).dialog("close"); //closing on Cancel
                clearTimeout (delay);
                setTimeout(callMe,1000);
            }
        }
    });
  }

  $(window).blur(function(e) {
    clearTimeout (delay);
    $("#dialog").dialog("close");
});

$(window).focus(function(e) {
    setTimeout(callMe,1000);
});