為什么clearInterval（）不起作用？

Question

我是JavaScript新手，但此腳本有問題。 它是網絡游戲的一部分，腳本假定刷新頁面，直到玩家贏或輸。 由於某種原因，它不會停止刷新，因此我放置了一個警報功能來檢查該功能是否正常工作，並且收到警報，但仍在繼續刷新頁面。 我究竟做錯了什么？

var t;

$(document).ready(function () {
    intervals();
});
function intervals() {
    t = self.setInterval('refreshData()', 10000);
}
function youWin() {
    var f = $('#status:contains("YOU ARE THE WINNER!")');
    if (f.length > 0) {
        alert("YOU ARE THE WINNER!");
        t = clearInterval(t);
    }
}
function youlose() {
    var f = $('#status:contains("You lost!")');
    if (f.length > 0) {
        alert("You lost!");
        t = clearInterval(t);
    }
}
function refreshData() {
    $('#ajaxGame').load('RefreshCurrentPlayerServlet #ajaxGame');
    youWin();
    youlose();
}

Answer 1

您需要修復對self的引用並修復.load()調用。

.load()是異步的，因此在您調用youWin()和youLose()之前不會完成。 您需要一個完成函數，以便您可以在.load()成功完成后檢查贏還是輸。

refreshData()結構應如下所示：

function refreshData() {
    $('#ajaxGame').load('RefreshCurrentPlayerServlet #ajaxGame', function() {
        youWin();
        youlose();
    });
}

您還應該更改此設置：

t= self.setInterval('refreshData()',10000);

對此：

t = window.setInterval(refreshData, 10000);

我什至沒有看到self甚至被定義為可能導致問題的原因，因此您應該直接使用函數引用，而不要放入字符串中。

並且，作為清理問題，您應該更改以下兩種情況：

t = clearInterval(t);

對此：

clearInterval(t);

這是代碼的清理版本，它也消除了全局變量和不必要的函數定義：

$(document).ready(function() {
    var t = window.setInterval(function() {
        $('#ajaxGame').load('RefreshCurrentPlayerServlet #ajaxGame', function() {
            youWin();
            youlose();
        });
    }, 10000);

    function youWin()  {
        if ($('#status:contains("YOU ARE THE WINNER!")').length) {
            alert("YOU ARE THE WINNER!");
            clearInterval(t);
        }
    }

    function youlose() {
        if ($('#status:contains("You lost!")').length) {
            alert("You lost!");
            clearInterval(t);
        }
    }

});