복붙노트

[JQUERY] 사용자가 종료 키까지 대신 입력 할 때 자바 스크립트 함수를 실행?

JQUERY

사용자가 종료 키까지 대신 입력 할 때 자바 스크립트 함수를 실행?

해결법


  1. 1.그래서, 당신은 단지 잠시 동안 중단 마무리 입력 수단을 추측거야, 5 초 말한다. 그래서 그와 마음에, 사용자가 키를 놓을 때 타이머를 시작하고 그들이 하나를 누르면을 취소 할 수 있습니다. 나는 문제의 입력 #myInput 될 것입니다 결정했다.

    그래서, 당신은 단지 잠시 동안 중단 마무리 입력 수단을 추측거야, 5 초 말한다. 그래서 그와 마음에, 사용자가 키를 놓을 때 타이머를 시작하고 그들이 하나를 누르면을 취소 할 수 있습니다. 나는 문제의 입력 #myInput 될 것입니다 결정했다.

    몇 가지 가정을 만들기 ...

    //setup before functions
    var typingTimer;                //timer identifier
    var doneTypingInterval = 5000;  //time in ms, 5 second for example
    var $input = $('#myInput');
    
    //on keyup, start the countdown
    $input.on('keyup', function () {
      clearTimeout(typingTimer);
      typingTimer = setTimeout(doneTyping, doneTypingInterval);
    });
    
    //on keydown, clear the countdown 
    $input.on('keydown', function () {
      clearTimeout(typingTimer);
    });
    
    //user is "finished typing," do something
    function doneTyping () {
      //do something
    }
    

  2. 2.선택된 대답은 위에서 작동하지 않습니다.

    선택된 대답은 위에서 작동하지 않습니다.

    typingTimer이 occassionaly 여러 번 설정되어 있기 때문에 다음이 제대로 지우지 않습니다 (를 keyDown가 빠른 typers 등에 트리거되기 전에의 keyup 두 번 누름).

    영업 이익은 요청대로 종료 후 해결할 수있는 문제 아래의 솔루션이 문제와 X 초를 호출합니다. 또한 더 이상 중복를 keyDown 기능을 필요로하지 않습니다. 또한 귀하의 의견이 비어있는 경우 함수 호출이 발생하지 않도록 검사를 추가했습니다.

    //setup before functions
    var typingTimer;                //timer identifier
    var doneTypingInterval = 5000;  //time in ms (5 seconds)
    
    //on keyup, start the countdown
    $('#myInput').keyup(function(){
        clearTimeout(typingTimer);
        if ($('#myInput').val()) {
            typingTimer = setTimeout(doneTyping, doneTypingInterval);
        }
    });
    
    //user is "finished typing," do something
    function doneTyping () {
        //do something
    }
    

    그리고 바닐라 자바 ​​스크립트 솔루션에서 동일한 코드 :

    //setup before functions
    let typingTimer;                //timer identifier
    let doneTypingInterval = 5000;  //time in ms (5 seconds)
    let myInput = document.getElementById('myInput');
    
    //on keyup, start the countdown
    myInput.addEventListener('keyup', () => {
        clearTimeout(typingTimer);
        if (myInput.value) {
            typingTimer = setTimeout(doneTyping, doneTypingInterval);
        }
    });
    
    //user is "finished typing," do something
    function doneTyping () {
        //do something
    }
    

    이 솔루션은 ES6를 사용하지하지만 여기 필요는 없습니다. 그냥 VAR 및 일반 기능 화살표 기능을하게 대체합니다.


  3. 3.그것은 underscore.js 디 바운스 기능을 하나 개의 라인이다 :

    그것은 underscore.js 디 바운스 기능을 하나 개의 라인이다 :

    $('#my-input-box').keyup(_.debounce(doSomething , 500));
    

    이것은 기본적으로 500 밀리 초 I 정지 입력 한 후 해봐요을 말한다.

    추가 정보를 원하시면 : http://underscorejs.org/#debounce


  4. 4.예, 말 2 각 초 아약스 요청을 발사하는 이벤트까지 모든 키의 시간 제한을 설정할 수 있습니다. 또한 더욱 당신이 대역폭을 저장하므로 후속 키 누르기 이벤트에 XHR 방법과 중단을 저장할 수 있습니다. 여기에 내가 내 자동 완성 스크립트 작성했습니다 뭔가.

    예, 말 2 각 초 아약스 요청을 발사하는 이벤트까지 모든 키의 시간 제한을 설정할 수 있습니다. 또한 더욱 당신이 대역폭을 저장하므로 후속 키 누르기 이벤트에 XHR 방법과 중단을 저장할 수 있습니다. 여기에 내가 내 자동 완성 스크립트 작성했습니다 뭔가.

    var timer;
    var x;
    
    $(".some-input").keyup(function () {
        if (x) { x.abort() } // If there is an existing XHR, abort it.
        clearTimeout(timer); // Clear the timer so we don't end up with dupes.
        timer = setTimeout(function() { // assign timer a new timeout 
            x = $.getJSON(...); // run ajax request and store in x variable (so we can cancel)
        }, 2000); // 2000ms delay, tweak for faster/slower
    });
    

    도움이 되었기를 바랍니다,

    마르코


  5. 5.

    var timer;
    var timeout = 1000;
    
    $('#in').keyup(function(){
        clearTimeout(timer);
        if ($('#in').val) {
            timer = setTimeout(function(){
                //do stuff here e.g ajax call etc....
                 var v = $("#in").val();
                 $("#out").html(v);
            }, timeout);
        }
    });
    

    여기에 전체 예 : http://jsfiddle.net/ZYXp4/8/


  6. 6.두 정상이 답변 나를 위해 작동하지 않습니다. 그래서, 여기 내 솔루션입니다 :

    두 정상이 답변 나를 위해 작동하지 않습니다. 그래서, 여기 내 솔루션입니다 :

    var timeout = null;
    
    $('#myInput').keyup(function() {
        clearTimeout(timeout);
    
        timeout = setTimeout(function() {
            //do stuff here
        }, 500);
    });
    

  7. 7.늦은 대답하지만 2019의이 꽤 ES6, 아니 타사 라이브러리를 사용하여 완전히 달성, 나는 높은 평가 답변의 대부분은 부피가 너무 많은 변수가 아래로 무게가 있습니다 찾을 수 있기 때문에 나는 그것을 추가 해요.

    늦은 대답하지만 2019의이 꽤 ES6, 아니 타사 라이브러리를 사용하여 완전히 달성, 나는 높은 평가 답변의 대부분은 부피가 너무 많은 변수가 아래로 무게가 있습니다 찾을 수 있기 때문에 나는 그것을 추가 해요.

    이 훌륭한 블로그 게시물에서 가져온 우아한 솔루션입니다.

    function debounce(callback, wait) {
      let timeout;
      return (...args) => {
          clearTimeout(timeout);
          timeout = setTimeout(function () { callback.apply(this, args) }, wait);
      };
    }
    
    window.addEventListener('keyup', debounce( () => {
        // code you would like to run 1000ms after the keyup event has stopped firing
        // further keyup events reset the timer, as expected
    }, 1000))
    

  8. 8.나는 초현실적 인 꿈의 대답하지만 같은 당신이 정말로 신속하게 "안녕하세요"를 입력하면 내 "doneTyping"기능 즉, 모든 키를 누를 때 해고 것으로 나타났습니다; 대신 입력을 중지 할 때 한 번 발사의 함수는 5 번 해고.

    나는 초현실적 인 꿈의 대답하지만 같은 당신이 정말로 신속하게 "안녕하세요"를 입력하면 내 "doneTyping"기능 즉, 모든 키를 누를 때 해고 것으로 나타났습니다; 대신 입력을 중지 할 때 한 번 발사의 함수는 5 번 해고.

    문제는 자바 스크립트의 setTimeout 함수를 덮어 쓰거나 설정된 오래된 시간 제한을 죽일 나타나지 않습니다,하지만 당신이 그것을 스스로 할 경우 작동한다! 난 그냥 단지에서는 setTimeout 전에 사항 clearTimeout 호출을 추가하도록 typingTimer이 설정되어있는 경우. 아래를 참조하십시오 :

    //setup before functions
    var typingTimer;                //timer identifier
    var doneTypingInterval = 5000;  //time in ms, 5 second for example
    
    //on keyup, start the countdown
    $('#myInput').on("keyup", function(){
        if (typingTimer) clearTimeout(typingTimer);                 // Clear if already set     
        typingTimer = setTimeout(doneTyping, doneTypingInterval);
    });
    
    //on keydown, clear the countdown 
    $('#myInput').on("keydown", function(){
        clearTimeout(typingTimer);
    });
    
    //user is "finished typing," do something
    function doneTyping () {
        //do something
    }
    

    N.B. 난 그냥 초현실적 인 꿈의 대답에 주석으로이 추가 좋았을 것이다 그러나 나는 새 사용자를 해요 충분한 명성을 필요가 없습니다. 죄송합니다!


  9. 9.허용 대답을 수정하면 같은 붙여 넣기 등의 추가 사례를 처리하기 위해 :

    허용 대답을 수정하면 같은 붙여 넣기 등의 추가 사례를 처리하기 위해 :

    //setup before functions
    var typingTimer;                //timer identifier
    var doneTypingInterval = 2000;  //time in ms, 2 second for example
    var $input = $('#myInput');
    
    // updated events 
    $input.on('input propertychange paste', function () {
        clearTimeout(typingTimer);
        typingTimer = setTimeout(doneTyping, doneTypingInterval);      
    });
    
    //user is "finished typing," do something
    function doneTyping () {
      //do something
    }
    

  10. 10.다음 지연 함수를 선언 :

    다음 지연 함수를 선언 :

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

    다음을 사용 :

    let $filter = $('#item-filter');
    $filter.on('keydown', function () {
        delay(function () {            
            console.log('this will hit, once user has not typed for 1 second');            
        }, 1000);
    });    
    

  11. 11.나는 (내가 틀렸다면 왜 말해주세요) keyDown 이벤트는이 경우에 필요하다 생각하지 않습니다. 그런 내 (비 JQuery와) 스크립트 유사한 솔루션 모습에서 :

    나는 (내가 틀렸다면 왜 말해주세요) keyDown 이벤트는이 경우에 필요하다 생각하지 않습니다. 그런 내 (비 JQuery와) 스크립트 유사한 솔루션 모습에서 :

    var _timer, _timeOut = 2000; 
    
    
    
    function _onKeyUp(e) {
        clearTimeout(_timer);
        if (e.keyCode == 13) {      // close on ENTER key
            _onCloseClick();
        } else {                    // send xhr requests
            _timer = window.setTimeout(function() {
                _onInputChange();
            }, _timeOut)
        }
    
    }
    

    나는이 사람, 언젠가는 도움이되기를 바랍니다, 그래서 그것은 스택 오버플로 내 첫 번째 답변입니다 :)


  12. 12.의 @going 대답에 동의합니다. 나를 위해 일한 또 다른 유사한 솔루션은 아래의 하나입니다. 유일한 차이점은 내가 대신의 keyup의 (... "입력") CSTE 연구진 사용하고 있다는 점이다. 이 단지 캡처 입력으로 변경합니다. Ctrl 키와 같은 다른 키 등 시프트 무시됩니다

    의 @going 대답에 동의합니다. 나를 위해 일한 또 다른 유사한 솔루션은 아래의 하나입니다. 유일한 차이점은 내가 대신의 keyup의 (... "입력") CSTE 연구진 사용하고 있다는 점이다. 이 단지 캡처 입력으로 변경합니다. Ctrl 키와 같은 다른 키 등 시프트 무시됩니다

    var typingTimer;                //timer identifier
    var doneTypingInterval = 5000;  //time in ms (5 seconds)
    
    //on input change, start the countdown
    
    $('#myInput').on("input", function() {    
        clearTimeout(typingTimer);
        typingTimer = setTimeout(function(){
            // doSomething...
        }, doneTypingInterval);
    });
    

  13. 13.음, 엄격하게 사용자가 완성 된 입력이있는 경우 컴퓨터가 추측 할 수 없기 때문에, 더 말할 수 없습니다. 당신은 물론 키를 백업에 타이머를 발사하고, 이후의 모든 키를 백업에 재설정 할 수있다. 타이머가 만료되면, 사용자는 타이머 기간 동안 입력하지 않은 - 당신은 "완성 된 입력"을 호출 할 수 있습니다.

    음, 엄격하게 사용자가 완성 된 입력이있는 경우 컴퓨터가 추측 할 수 없기 때문에, 더 말할 수 없습니다. 당신은 물론 키를 백업에 타이머를 발사하고, 이후의 모든 키를 백업에 재설정 할 수있다. 타이머가 만료되면, 사용자는 타이머 기간 동안 입력하지 않은 - 당신은 "완성 된 입력"을 호출 할 수 있습니다.

    당신은 사용자가 입력하는 동안 일시 정지를 만들기 위해 기대한다면, 그들은이 완료되면 알 수있는 방법이 없습니다.

    (그들은이 완료되면 물론하지 않는 한 당신은 데이터에서 알 수 있습니다)


  14. 14.솔루션이 입력 이벤트와 다소 조금 간단 같은 느낌 :

    솔루션이 입력 이벤트와 다소 조금 간단 같은 느낌 :

    var typingTimer;
    var doneTypingInterval = 500;
    
    $("#myInput").on("input", function () {
        window.clearTimeout(typingTimer);
        typingTimer = window.setTimeout(doneTyping, doneTypingInterval);
    });
    
    function doneTyping () {
        // code here
    }
    

  15. 15.난 그냥 마무리 입력에 대한 사용자 기다려야하는 간단한 코드를 알아 낸 :

    난 그냥 마무리 입력에 대한 사용자 기다려야하는 간단한 코드를 알아 낸 :

    사용자가 입력 인 경우 null로 밖으로 단계 1.set 시간은 현재 시간 제한을 취소합니다.

    의 keyup 이벤트가 트리거되기 전에 변수에 단계 2.trigger 명확한 시간 제한을 정의합니다.

    가변하는 단계 3.define 시간 제한은 상기 선언;

    <input type="text" id="input" placeholder="please type" style="padding-left:20px;"/>
    <div class="data"></div>
    

    자바 스크립트 코드

    var textInput = document.getElementById('input');
    var textdata = document.querySelector('.data');
    // Init a timeout variable to be used below
    var timefired = null;
    
    // Listen for keystroke events
    // Init a timeout variable to be used below
    var timefired = null;// Listen for keystroke events
    textInput.onkeyup = function (event) {
    clearTimeout(timefired);
    timefired = setTimeout(function () {
        textdata.innerHTML = 'Input Value:'+ textInput.value;
      }, 600);
    };
    

  16. 16.내 목록에서 검색을 구현하고 아약스를 기반으로 그것을 필요로했다. 모든 키의 변화에 ​​결과를 검색하는 것이 그 수단이 업데이트 표시되어야합니다. 많은 아약스 호출에이 결과는 좋은 일하지 않은, 서버로 전송.

    내 목록에서 검색을 구현하고 아약스를 기반으로 그것을 필요로했다. 모든 키의 변화에 ​​결과를 검색하는 것이 그 수단이 업데이트 표시되어야합니다. 많은 아약스 호출에이 결과는 좋은 일하지 않은, 서버로 전송.

    일부 작업 후, 사용자가 입력을 중지 할 때 서버를 ping 할 수있는 방법을했다.

    이 솔루션은 나를 위해 일한 :

    $(document).ready(function() {
        $('#yourtextfield').keyup(function() {
            s = $('#yourtextfield').val();
            setTimeout(function() { 
                if($('#yourtextfield').val() == s){ // Check the value searched is the latest one or not. This will help in making the ajax call work when client stops writing.
                    $.ajax({
                        type: "POST",
                        url: "yoururl",
                        data: 'search=' + s,
                        cache: false,
                        beforeSend: function() {
                           // loading image
                        },
                        success: function(data) {
                            // Your response will come here
                        }
                    })
                }
            }, 1000); // 1 sec delay to check.
        }); // End of  keyup function
    }); // End of document.ready
    

    이 작업을 실행하는 동안 모든 타이머를 사용할 필요가 없다는 것을 알 수 있습니다.


  17. 17.이것은 내가 쓴 간단한 JS 코드입니다 :

    이것은 내가 쓴 간단한 JS 코드입니다 :

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pt-br" lang="pt-br">
    <head><title>Submit after typing finished</title>
    <script language="javascript" type="text/javascript">
    function DelayedSubmission() {
        var date = new Date();
        initial_time = date.getTime();
        if (typeof setInverval_Variable == 'undefined') {
                setInverval_Variable = setInterval(DelayedSubmission_Check, 50);
        } 
    }
    function DelayedSubmission_Check() {
        var date = new Date();
        check_time = date.getTime();
        var limit_ms=check_time-initial_time;
        if (limit_ms > 800) { //Change value in milliseconds
            alert("insert your function"); //Insert your function
            clearInterval(setInverval_Variable);
            delete setInverval_Variable;
        }
    }
    
    </script>
    </head>
    <body>
    
    <input type="search" onkeyup="DelayedSubmission()" id="field_id" style="WIDTH: 100px; HEIGHT: 25px;" />
    
    </body>
    </html>
    

  18. 18.당신은 텍스트 상자가 포커스를 잃을 때 감지하기 위해 onblur 이벤트를 사용할 수 있습니다 : https://developer.mozilla.org/en/DOM/element.onblur

    당신은 텍스트 상자가 포커스를 잃을 때 감지하기 위해 onblur 이벤트를 사용할 수 있습니다 : https://developer.mozilla.org/en/DOM/element.onblur

    "입력을 멈춘"당신은 사용자 유형 잔뜩 다음 텍스트 상자에이 앉아 여전히 초점을 맞추고 사건에 대해 걱정하는 경우 즉, 같은 아니에요.

    나는 온 클릭 이벤트에의 setTimeout을 매는없이 키 입력과 시간의 X 금액 후, 사용자가 입력을 중지한다고 가정 제안 것이라고하십시오.


  19. 19.이유는 단지 onfocusout 사용하지?

    이유는 단지 onfocusout 사용하지?

    https://www.w3schools.com/jsreF/event_onfocusout.asp

    이 폼의 경우, 항상 더 입력이 onfocusout 이벤트 핸들러가 호출 받고 놓치지 않을 것이다 알 수 있도록 제출 버튼을 클릭하기 위해 모든 입력 필드의 초점을 남겨 둘 것이다.


  20. 20.현장에서 멀리 이동하는 사용자에 대한 필요성이 있다면, 우리는 자바 스크립트에서 "및 onblur"대신 onchange를 사용할 수 있습니다

    현장에서 멀리 이동하는 사용자에 대한 필요성이 있다면, 우리는 자바 스크립트에서 "및 onblur"대신 onchange를 사용할 수 있습니다

      <TextField id="outlined-basic"  variant="outlined" defaultValue={CardValue} onBlur={cardTitleFn} />
    

    그가 아닌 경우 필요한 설정 타이머가 좋은 옵션이 될 것입니다.


  21. 21.텍스트 상자에 초점을 감지하면, 키에 최대 타임 아웃 점검을하고, 그것을 트리거 될 때마다 다시 설정합니다.

    텍스트 상자에 초점을 감지하면, 키에 최대 타임 아웃 점검을하고, 그것을 트리거 될 때마다 다시 설정합니다.

    타임 아웃이 완료, 당신의 아약스 요청을 수행 할 때.


  22. 22.당신은 (예 : 우편 번호 필드로) 특정 길이를 찾는 경우 :

    당신은 (예 : 우편 번호 필드로) 특정 길이를 찾는 경우 :

    $("input").live("keyup", function( event ){
    if(this.value.length == this.getAttribute('maxlength')) {
            //make ajax request here after.
        }
      });
    

  23. 23.확실하지 내 요구는 단지 어떤 이상한의,하지만 난이 비슷한 무언가를 필요로하고 이것이 내가 사용하는 결국 어떤 경우 :

    확실하지 내 요구는 단지 어떤 이상한의,하지만 난이 비슷한 무언가를 필요로하고 이것이 내가 사용하는 결국 어떤 경우 :

    $('input.update').bind('sync', function() {
        clearTimeout($(this).data('timer'));            
        $.post($(this).attr('data-url'), {value: $(this).val()}, function(x) {
            if(x.success != true) {
                triggerError(x.message);    
            }
        }, 'json');
    }).keyup(function() {
        clearTimeout($(this).data('timer'));
        var val = $.trim($(this).val());
        if(val) {
            var $this = $(this);
            var timer = setTimeout(function() {
                $this.trigger('sync');
            }, 2000);
            $(this).data('timer', timer);
        }
    }).blur(function() {
        clearTimeout($(this).data('timer'));     
        $(this).trigger('sync');
    });
    

    어느 날 내 응용 프로그램이 같은 요소를 가지고 있습니다 :

    <input type="text" data-url="/controller/action/" class="update">
    

    어떤 사용자가 "완료 입력"(2 초 동안 아무런 조치)이 없거나 다른 필드로 갈 때 업데이트됩니다 (요소 중 흐림)


  24. 24.사용자가 입력 사용 간단한이 완료 될 때까지 대기해야하는 경우 :

    사용자가 입력 사용 간단한이 완료 될 때까지 대기해야하는 경우 :

    $(document).on('change','#PageSize', function () {
        //Do something after new value in #PageSize       
    });
    

    내 호출기에 대해이 작업 - - 아약스 호출로 전체 예제 목록 당 항목 수 :

    $(document).ready(function () {
        $(document).on('change','#PageSize', function (e) {
            e.preventDefault();
            var page = 1;
            var pagesize = $("#PageSize").val();
            var q = $("#q").val();
            $.ajax({
                url: '@Url.Action("IndexAjax", "Materials", new { Area = "TenantManage" })',
                data: { q: q, pagesize: pagesize, page: page },
                type: 'post',
                datatype: "json",
                success: function (data) {
                    $('#tablecontainer').html(data);
                   // toastr.success('Pager has been changed', "Success!");
                },
                error: function (jqXHR, exception) {
                    ShowErrorMessage(jqXHR, exception);
                }
            });  
        });
    });    
    

  25. 25.다른 모든 답은 하나의 제어 (내 다른 대답 포함)에 대한 작동합니다. 당신은 여러 컨트롤 페이지 당 (예를 들어 쇼핑 카트에) 사용자 입력 뭔가가 불려가는 마지막 컨트롤이있는 경우. 내 경우에는이 확실히달라고 행동하지 않습니다 - 각 컨트롤은 자신의 타이머를 가져야한다.

    다른 모든 답은 하나의 제어 (내 다른 대답 포함)에 대한 작동합니다. 당신은 여러 컨트롤 페이지 당 (예를 들어 쇼핑 카트에) 사용자 입력 뭔가가 불려가는 마지막 컨트롤이있는 경우. 내 경우에는이 확실히달라고 행동하지 않습니다 - 각 컨트롤은 자신의 타이머를 가져야한다.

    이 문제를 해결하기 위해, 당신은 단순히 함수에 ID를 전달하고 timeoutHandles는 다음 코드와 같이 사전을 유지해야한다 :

    함수 선언 :

    var delayUserInput = (function () {
        var timeoutHandles = {};    
        return function (id, callback, ms) {        
            if (timeoutHandles[id]) {
                clearTimeout(timeoutHandles[id]);
            }
    
            timeoutHandles[id] = setTimeout(callback, ms);             
        };
    })();
    

    기능 사용법 :

      delayUserInput('yourID', function () {
         //do some stuff
      }, 1000);
    

  26. 26.간단하고 이해하기 쉽다.

    간단하고 이해하기 쉽다.

    var mySearchTimeout;
    $('#ctl00_mainContent_CaseSearch').keyup(function () {
       clearTimeout(mySearchTimeout);
       var filter = $(this).val();
       mySearchTimeout = setTimeout(function () { myAjaxCall(filter); }, 700);
       return true;
    });
    

  27. 27.ES6 구문과 함께 함수에 매개 변수를 전달하십시오.

    ES6 구문과 함께 함수에 매개 변수를 전달하십시오.

    $(document).ready(() => {
        let timer = null;
         $('.classSelector').keydown(() => {
         clearTimeout(timer); 
         timer = setTimeout(() => foo('params'), 500);
      });
    });
    
    const foo = (params) => {
      console.log(`In foo ${params}`);
    }
    

  28. 28.와우, 심지어 3 개의 댓글이 꽤 정확!

    와우, 심지어 3 개의 댓글이 꽤 정확!

    편집 나는 어떤 사람들은 준비 코드를 복사 붙여 넣기 할 가능성이없는 지시를 이해하지 못하는 것을 알 수있다. 당신이있어 이곳까지

    var typingTimer;
    //                  2
    $("#myinput").on('input', function () {
        //             4     3
        var input = $(this).val();
        clearTimeout(typingTimer);
        //                           5
        typingTimer = setTimeout(function() {
            // do something with input
            alert(input);
        }, 5000);      
    });
    
  29. from https://stackoverflow.com/questions/4220126/run-javascript-function-when-user-finishes-typing-instead-of-on-key-up by cc-by-sa and MIT license