jQuery/JavaScript : 인터럽트 이벤트?

Question

이것은 정말 기본적인 자바 스크립트 질문이며 아마도 중복되지만 답변을 모릅니다!

function userlist_change(myval, function_type) { 
    // relatively slow code involving Ajax call 
    // based on Ajax results, change some client-side stuff 
} 
$("#subjectlist").change(function() { 
    userlist_change($("#subjectlist").val(), 'change'); 
}).change(); 
$("#subjectlist").keypress(function() { 
    userlist_change($("#subjectlist").val(), 'keypress'); 
}); 

나는 .change() 이벤트가 호출 될 경우 userlist_change 기능이 개막하는 문제가 있고, 비교적 느린 다음과 같이

나는 코드가 있습니다. 사용자가 목록을 다시 변경하면 (예 : 입력) 코드에서 userlist_change이 완료 될 때까지 기다렸다가 새 값으로 다시 시작합니다.

클라이언트 측을 변경하는 데 몇 초가 걸릴 수 있으므로 UI에서 상당히 이상하게 보입니다. 사용자가 이미 두 번째 전화를 건 후에 만 ​​첫 번째 전화의 결과가 나타나는 경우가 있습니다.

.change() 또는 'keypress()'이벤트가 실행될 때 기존의 userlist_change 프로세스를 방해 할 수있는 방법이 있습니까?

[편집] 이상적이라고 할 수있는 것은 '이 이름으로 실행중인 모든 기능을 죽이는'명령입니다. 이것이 가능합니까? 아니면 정말로 타이머를 가지고 주위를 둘러 봐야합니까?

Answer 1

이벤트 조절을 사용해야합니다. 자바 스크립트에서 RX를 사용하면 매우 쉽게 처리 할 수 ​​있지만 라이브러리는 상당히 복잡합니다. 타이머로 필터 값을 시도 할 수 있습니다. 여기

가 조절에 유용한 플러그인입니다 : http://benalman.com/projects/jquery-throttle-debounce-plugin/

Answer 2

당신이 전역 변수에 마지막 요청 시간을 저장하고, 각 아약스 요청에 요청 시간을 저장할 수 있도록 당신은 단지 첫 번째 요청의 결과를 표시하는 경우, 글로벌 마지막 요청 시간이 요청보다 크면 요청 시간을 표시해야합니다. 예 :

var lastRequestTime; 

function userlist_change(myval, function_type,requestTime) { 

    // relatively slow code involving Ajax call 
    // based on Ajax results, change some client-side stuff 

if(lastRequestTime <= requestTime){ 
//show 
} 
} 
$("#subjectlist").change(function() { 
    lastRequestTime = new Date(); 
    userlist_change($("#subjectlist").val(), 'change',lastRequestTime); 
}).change(); 
$("#subjectlist").keypress(function() { 
    lastRequestTime = new Date(); 
    userlist_change($("#subjectlist").val(), 'keypress',lastRequestTime); 
});