带有if语句的Window.onblur

Question

我正在建立一种时钟，我强烈需要使用settimeout() 。

但是，当选项卡处于非活动状态时，Google Chrome和Safari不允许settimeout() 。 因此，我决定在选项卡再次处于活动状态时重新加载页面。 （我知道，这不是正确的方法，但是我是javascript语言的新手，并且尝试学习。）我看到了这个答案，并尝试针对我的情况实施。 但是有一个挑战，我在此页面中有3个模态，并且当模态打开时，我不希望重新加载页面。

因此，我添加了一个全局变量，使它等于一个整数，然后在模态打开时更改了变量的值。

这是我的代码，

var modalCheck = 2;

function openModal() {
    var doneModal = document.getElementById("done");
    var done = document.getElementsByClassName("closeMessage")[0];

    modalCheck = 1;

    doneModal.style.display = "block";

    done.onclick = function() {
        doneModal.style.display = "none";
        modalCheck = 2;
    }

    window.onclick = function(event) {
        if (event.target == doneModal) {
            doneModal.style.display = "none";
            modalCheck = 2;
        }
    }
}

window.onblur = function() {
    window.onfocus= function () {
        if (modalCheck = 2) {
            console.log(modalCheck);
            location.reload(true);
        }
    }
}; 

页面重新加载仍在工作，但是如果打开模式，则页面将立即重新加载。

我的问题是为什么这不起作用？ 是否存在语法错误或类似的东西？ 解决办法是什么？

Answer 1

这是问题所在：

if ( modalCheck = 2 ) {

此“ if”条件始终为true，因为实际上是将值“ 2”分配给“ modalCheck”，而不是检查“ modalCheck”是否等于“ 2”。 赋值解析为值“ 2”，在if语句中将其视为“真实”表达式。 因此，此if语句永远不会失败。 我建议

if ( modalCheck === 2 ) {

其他人建议使用“ if（modalCheck == 2）{”，但是通常最好使用===进行比较，而不是使用==进行比较，以避免意外的怪异。

Answer 2

我不知道您的html部分是什么，请尝试以下代码

   var modalCheck = 2;

    function openModal() {
        var doneModal = document.getElementById("done");
        var done = document.getElementsByClassName("closeMessage")[0];

        modalCheck = 1;

        doneModal.style.display = "block";

        done.onclick = function() {
            doneModal.style.display = "none";
            modalCheck = 2;
        }

        window.onclick = function(event) {
            if (event.target == doneModal) {
                doneModal.style.display = "none";
                modalCheck = 2;
            }
        }
    }

    window.onblur = function() {
     this.addEventListener('focus',function(){
        if (modalCheck == 2) {
                console.log(modalCheck);
                location.reload(true);
         }});

        };