首页 > 解决方案 > Javascript SetTimeout函数在执行后不暂停

问题描述

我正在检查 CSS 类的变化。我希望每 1000 毫秒进行一次检查。目前在谷歌浏览器控制台中,我可以看到它没有任何延迟地检查,导致网页崩溃。下面的 setTimeout 函数有什么问题?也许还有另一种方法来检查 CSS 类的变化?

var itemInfo = null;

itemInfo = document.getElementById('option-item-info');
while (itemInfo.className == "disabled") {
    console.log("Test 1");
    getOptionItemInfo();
}

function getOptionItemInfo() {
    setTimeout(function() {
        console.log("Checking...");
        itemInfo = document.getElementById('option-item-info');
    }, 1000);
}

标签: javascriptcssweb

解决方案


您的while循环不会等待setTimeout异步回调,它只会触发大量setTimeouts直到您的浏览器崩溃。相反,只需启动setTimeout一次,然后仅在未满足所需条件时从回调中再次调用它。

getOptionItemInfo();

function getOptionItemInfo() {
    setTimeout(function() {
        console.log("Checking...");
        var itemInfo = document.getElementById('option-item-info');
        if (itemInfo.className == "disabled") {
            getOptionItemInfo(); 
        } else {
            console.log("done!");
        }
    }, 1000);
}

推荐阅读