jquery 자동 채우기 및 시간 초과

Question

쿼리에 대한 자동 채우기를 위해 찾은 스크립트를 구현했습니다. 문제는 그가 키를 누를 때마다 스크립트를 호출한다는 것입니다. 타임 아웃을 추가하려고했지만 여전히 문제가 발생합니다. 다음 코드 :

<input type="text" onkeyup="lookup(this.value);"> 

function lookup(inputString) { 
var time = new Date().getTime(); 
var dummy_trigger = true; 
if(inputString.length == 0) { 
    $('#suggestions').fadeOut(); // Hide the suggestions box 
} else { 
function timepassed(){ 
    now = new Date().getTime() - time; 

    if(now > 3000 && dummy_trigger){ 
    alert("search"); 
    dummy_trigger = false; 
    } 
} 
setInterval(timepassed, 1000); 
} 
} 

어떤 아이디어? 감사!

Answer 1

이미 jQuery를 사용하고 있으므로 자동 완성 플러그인을 추가하거나 해당 플러그인에 jQuery UI를 사용하십시오.

다음은 플러그인에 대한 링크와 jQuery UI 전환에 대한 참고 사항입니다. http://bassistance.de/jquery-plugins/jquery-plugin-autocomplete/

Answer 2

다른 사람들이 자동 완성 플러그인을 사용하여 보내 주신 질문에 답변했지만 실제로 다음과 같은 질문에는 답변이되지 않습니다. "어떻게하면 모든 스크립트가 자동으로 실행되지 않습니까? 키 누름?"

왜 이것이 중요한가요? 지연이없는 로컬 데이터 (응답 성이 높음)는 의미가 있지만 응답 성이 떨어지는 반면 원격 데이터에 많은로드가 발생할 수 있습니다. 모든 키 입력 후에 각 검색이 시작되면 사용자는 나머지 단어를 입력하는 방법을 알아낼 수 없을 때까지 스크립트가 기다려야 할 때 'chrysanthemum'이라는 단어를 검색하기 위해 13 번의 검색을 시작합니다. 그런 다음 수색을 시작합니다.

대부분의 자동 완성/자동 제안 스크립트 시간 제한 에 대한 변수를 가지고 있지만 여기에 jQuery를 사용하여 사용자를 기다리는 자신의 타이머를 구현하는 방법은 다음 HTML 어떤 자바 스크립트에 의해 오염되지 않는 방법

<input type="text" id="query" /> 

주 . 이는 jQuery의 Awesomeness가 필요한 기능을 수행하기 위해 HTML에 임베드 된 JS에 의존하지 않기 때문입니다.

$(document).ready(function() { 
    var timer, 
     $suggestions = $('#suggestions'), 
     $search_box = $('#query'); 

    $search_box.keyup(function() { 
     if (timer) { 
      // There is a running timer from a previous keyup 
      // Clear this timer so we don't have overlap 
      clearTimeout(timer); 
     } 

     if (this.length == 0) { 
      $suggestions.fadeOut(); 
     } else {   
      timer = setTimeout(function() { 
       search(); 
      }, 1000); 
     } 
    }); 

    function search() { 
     var query = $search_box.val(); 
     alert('searching for ' + query); 
    } 
}); 

여기에 무슨 일이 일어나고 있는지입니다 : 우리는 당신의 keyup 기능 위에서 언급해야하는 변수로 setTimeout 타이머를 할당하고, 그 변수마다 keyup 화재를 확인합니다. 진행중인 기존 setTimeout이있는 경우 search() 기능을 실행하지 않도록 삭제하고 지정된 시간 (예 : 1000)을 대기하도록 설정 한 새 타이머를 만듭니다.