Question

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

那么有没有办法在短时间内检测到多个变化而没有任何变化。然后，如果发生变化，并且在x时间之后不再发生变化。做点什么。

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

我的代码只是推迟了解雇。

那么我们怎样才能做到这一点。

在这里找到重复的问题和答案 Jquery change with delay

Answer 1

以下是我在输入框上所做的事情，以防止在用户输入时触发频繁更改：

         var timeoutId = 0;    
         object.dom.input.addEventListener('input',function() {
            clearTimeout(timeoutId);
            // do stuff
            // Fire our onchange event
                if (this.delayOnChange > 0) {
                    timeoutId = setTimeout(function() { this.onchange() }, this.delayOnChange);
                } else {
                    this.onchange();
                }
            }
        },false);

这会检查我们是否设置了“延迟更改”，如果我们延迟触发“onchange（）＆＃39;事件。我们每次对输入进行更改时都会重置计时器（clearTimeout（）），因此我们基本上等待用户在触发onchange之前停止快速输入。

Answer 2

下面的代码会将工作延迟到上一次“输入”事件以来经过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);
 });

jquery onchange set timeout

2 个答案: