2011-02-17 4 views
0

これは本当に基本的なJavaScriptの質問で、恐らく重複していますが、その答えはわかりません!jQuery/JavaScript:割り込みイベントですか?

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ではかなり奇妙に見えます。また、最初の呼び出しの結果は、ユーザーが2度目の呼び出しを行った後にのみ表示されることもあります。

.change()または `keypress()イベントが発生したときに、既存のuserlist_changeプロセスを中断する方法はありますか?

[編集]理想的と思われるのは、この名前で実行中の機能を単純に殺すことです。これは可能ですか?それとも、私は本当にタイマーで練習する必要がありますか?

答えて

0

イベントの抑制を使用する必要があります。 JavaScriptのRXでは非常に簡単ですが、ライブラリはかなり複雑です。タイマーでフィルター値を試すことができます。ここで

は、スロットリングのための便利なプラグインです:http://benalman.com/projects/jquery-throttle-debounce-plugin/

1

あなたはグローバル変数に最後の要求の時間を格納し、かつ、それぞれのAjaxリクエストで要求時間を格納することができますようにあなただけの最初の要求の結果を示しているとき、グローバルな最後の要求時間が要求より大きい場合、要求時間、あなたは他の賢明ではない、表示する必要があります。例:

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); 
});