确保一次只运行一个setTimeout（处于活动状态）？ [英] Ensure only one setTimeout runs (is active) at a time?

问题描述

标签中递归的 setTimeout 函数getRandomProducts被称为 onload ，所以不断重复。<

函数setCategoryTree被从导航栏的嵌套ul中的链接调用 onclick 。 然后这个函数将变量mainCategory传递给getRandomProducts，其中变量被全局声明以维持它的初始化。所以，我试图做的是在导航栏中单击链接时重置getRandomProducts函数，并从单击的链接传递类别名称。但是， clearTimeout 似乎没有工作，所以迭代的发生频率更高，因为同时执行多个递归循环。 />
不仅如此，而且我的全局变量并不像预期的那样存储来自setCategoryTree的数据（基本上我试图使用全局变量类似于静态变量）。我用 window.alert 分辨出了所有这些行为。

以下是相关的Javascript代码：

  var mainCategory =; //从setCategoryTree 
初始化var category = mainCategory; 
 
 function getRandomProducts（category）
 {
 //window.alert(category）; 
 if（typeof category ==undefined）
 category =all; 
 else 
 clearTimeout（t）; 
 
 var req = new XMLHttpRequest（）; 
 
 var products = document.getElementById（products）; 
 
 req.onreadystatechange = function（）
 {
 if（（req.readyState == 4）&&（req.status == 200））
 {
 var result = req.responseText; 
 products.innerHTML = result; 
 
 
 req.open（GET，default.php？category =+ category，true）; 
 req.send（null）; 
 
 var t = setTimeout（getRandomProducts（），1000）; 
} 
 
函数setCategoryTree（link）
 {
 var categoryTree = document.getElementById（categoryTree）; 
 
 / *使用DOM树来获取类别名称（innerHTML中最高的a标签）* / 
 mainCategory = link.parentNode.parentNode.parentNode.getElementsByTagName（a ）[0] .innerHTML; 
 
 var subcategory = link.innerHTML; 
 
 categoryTree.innerHTML = - & nbsp; + mainCategory +& nbsp;& nbsp;  - & nbsp; +子类别; 
 
 getRandomProducts（mainCategory）; 
 
  

解决方案

code> t 。下一次调用这个函数时，var t 将不可用。

因此，设置变量上面的函数（不包含在其中）

  var randomProductsTimeout = false; 
 
 function getRandomProducts（category）{
 
 randomProductsTimeout = setTimeout（）[..] 
  

The recursive setTimeout function getRandomProducts is called onload in the html body tag, and so is constantly iterating.

The function setCategoryTree is being called onclick from the links in a nested ul of a navigation-bar. This function then passes the variable mainCategory to getRandomProducts, in which the variable is declared globally to maintain its' initialization.

...So, what I am trying to do is reset the getRandomProducts function when a link is clicked in the navigation-bar, and pass the category name from the link that was clicked. However, clearTimeout does not seem to be working and so the iterations occur a lot more frequently as there are then multiple recursive loops executing simultaneously.

And not only that, but my global variables are not storing data from setCategoryTree as intended (basically I am trying to use the global variable similarly to a static-variable). I have discerned all of this behavior with the window.alert that is commented out.

Here is the relevant Javascript code:

var mainCategory = ""; // initialized from setCategoryTree
var category = mainCategory;

function getRandomProducts(category)
{
    //window.alert(category);
    if(typeof category == "undefined")
        category = "all";
    else
        clearTimeout(t);

    var req = new XMLHttpRequest();

    var products = document.getElementById("products");

    req.onreadystatechange = function()
    {
        if( (req.readyState == 4) && (req.status == 200) )
        {
            var result = req.responseText;
            products.innerHTML = result;
        }
    }
    req.open("GET", "default.php?category=" + category, true);
    req.send(null);

    var t = setTimeout("getRandomProducts()", 1000);
}

function setCategoryTree(link)
{
    var categoryTree = document.getElementById("categoryTree");

    /* climbing the DOM-tree to get the category name (innerHTML of highest "a" tag) */
        mainCategory = link.parentNode.parentNode.parentNode.getElementsByTagName("a")[0].innerHTML;

    var subcategory = link.innerHTML;

    categoryTree.innerHTML = "-- " + mainCategory + "  -- " + subcategory;

    getRandomProducts(mainCategory);
}

解决方案

You are setting the variable t within the function. The next time this function gets called the var t will not be available for you.

Therefore, Set the variable above the function (not in it)

var randomProductsTimeout = false;

function getRandomProducts(category){

    randomProductsTimeout = setTimeout()[..]

这篇关于确保一次只运行一个setTimeout（处于活动状态）？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！