jQuery keyup with delay

Question

I would like you show an alert message after the function keyup(). For this I use the following code:

$('#myInputingNumber').keyup(function() {
  alert ("Key Up")
})

This works good and the alert message shows after each keyup call. But this is not really good.

Is there any way to check, if the user has 2 seconds long no "keyup" and show only then the alert message?

Answer 1

You can try this one also.

var flag = false;
$(function(){
  $("#demoKeyup")
  .keydown(function(){
    flag = true;
    setTimeout(function(){
      if (flag == true) {
        alert("still key down");
        flag = false;
      }
    },2000);
  })
  .keyup(function(){
    flag = false;
  })

})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

<input type="text" id="demoKeyup">

Answer 2

 let delay = (()=>{
      let timer = 0;
      return function(callback, ms){
        clearTimeout (timer);
        timer = setTimeout(callback, ms);
      };
    })();

    window.document.getElementById("myInputingNumber").addEventListener("keyup",function() {
        delay(function(){
          alert('Key Up');
        }, 2000 );
    });

<input type="text" id="myInputingNumber">