javascript - jquery onchange 设置超时

Question

我希望当用户更改输入字段中的数量时触发某些代码。但是当用户使用向上和向下的小箭头快速增加和减少数量时。就像按 5 次以达到 5。我不希望代码触发 5 次。所以我想设置一个计时器。当检测到更改事件时，它将等待 1 秒或等到更改停止。然后获取最新值。

那么有没有一种方法可以在短时间内检测到多个变化而不是什么。然后，如果发生变化并且在 x 时间后不再发生变化。做点什么。

$("#quantity").on('change',function(){
    setTimeout(function(){ 
        console.log("fired");
    }, 1000);
});

我的代码只是延迟触发。

那么我们如何才能做到这一点。

在此处找到重复的问题和答案 Jquery change with delay

Answer 1

下面的代码会将工作延迟到自上次“输入”事件后 3 秒。如果在超时执行其功能之前发生另一个“输入”事件，它会通过取消先前的超时(通过 clearTimeout)来实现此目的。

 let time = 0;

 // On change paste keyup.
 $('#address_1').on('input', function () {
     // Reset the timer
     clearTimeout(time);

     time = setTimeout(function() {
         // enter code here or a execute function.
         doGeocode();
     }, 3000);
 });