事件停止重复


                    

我有一个带有以下HTML行的Web应用程序:</ p>

  
</ code> </ pre>

和关联的JS是:</ p>

 函数update()
{
     val = document.getElementById(“ dropdown”)。value;
     arr = some_dict [val];
     CHUNK_SIZE = 1024;
     i = 0;

     函数recursive_call()
     {
         数据= arr.slice(CHUNK_SIZE * i,CHUNK_SIZE * i + CHUNK_SIZE);
         if(data.length <CHUNK_SIZE){return;}
         ...
         $ .ajax({
             输入:“ POST”,
             url:“ / page”,
             数据:{“数据”:数据},
             异步:是的,
             成功:功能(d){
                 setTimeout(another_func,3000);
                 recursive_call();
             }
         })
         i ++;
     }

}
</ code> </ pre>

基本上,每当选择一个新的下拉值时,我都会从数组中递归提取连续的块并将其发送到我的服务器。 当数组长度小于块大小时,我返回,停止此过程。</ p>

问题是当选择新的下拉值并且递归不完整时。 选择新值时,我想停止现有的循环循环,并开始针对与该新值关联的新数组开始循环。</ p>

我已经尝试了一些方法,但是代码太凌乱了,会进一步使我在这里描述的内容变得混乱。</ p>
     </ div>

展开原文

原文

I have a web app with the following HTML line:

<select id="dropdown"; onchange="update()">

and the associated JS is:

function update()
{
    val = document.getElementById("dropdown").value;
    arr = some_dict[val];
    CHUNK_SIZE = 1024;
    i = 0;

    function recursive_call()
    {
        data = arr.slice(CHUNK_SIZE*i, CHUNK_SIZE*i + CHUNK_SIZE);
        if (data.length < CHUNK_SIZE){return;}
        ...
        $.ajax({
            type: "POST",
            url: "/page",
            data: {"data": data},
            async: true,
            success: function (d){
                setTimeout(another_func, 3000);
                recursive_call();
            }
        })
        i++;
    }

}

Essentially, whenever a new dropdown value is selected, I recursively extract consecutive chunks from an array and send them to my server. When the array length is less than the chunk size, I return, stopping this process.

The issue is when a new dropdown value is selected and the recursion is incomplete. I would like to stop the existing recurring loop when a new value is selected, and beginning recurring for a new array associated with the new value.

I have tried a few things but the code is super messy and would further convolute what I have described here.

1个回答


这是一个使用间隔而不是递归的类似功能的示例。 </ p>

这样做的好处是您可以使用 clearInterval </ code> </ p>取消间隔

</ p>



  let intervalReference = null
让计数器= 0

函数update(){
    计数器= 0
    if(intervalReference!== null){
         clearInterval(intervalReference)
    }
  
   intervalReference = setInterval(()=> {
   计数器++
   console.log(计数器)
         //在这里做你的ajax
   },1000)
} </ code> </ pre>

  
  A </ option>
   B </ option>
</ select> </ code> </ pre>
</ div>
</ div>

     </ div>

展开原文

原文

Here's an example of similar functionality using intervals instead of recursion.

The benefit of this is you can cancel an interval with clearInterval

let intervalReference = null
let counter = 0

function update() {
   counter = 0
   if(intervalReference !== null){
        clearInterval(intervalReference)
   }
  
  intervalReference = setInterval(()=>{
    counter++
    console.log(counter)
        //do your ajax in here
  }, 1000)
}
<select id="dropdown" onchange="update()">
 <option value="a">A</option>
  <option value="b">B</option>
</select>

</div>

Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!
立即提问
相关内容推荐