jQuery UIオートコンプリート入力時に最後のクエリをキャンセルします。

Question

私のサイトで都市検索にjQuery UIオートコンプリートを使用しています。ユーザーが3文字を入力した後で検索を開始します。

私はこのスクリプトを変更して、ユーザーが入力を続けると最後のクエリを中止する方法を知っています。

function enableCitiesAutocomplete() { 
    var url = LIST.urls.api_cities_search; 

    $('#txt_search_city').autocomplete({ 
     source: url, 
     minLength: 3, 
     select: function(event, ui) { 
      $(this).val(ui.item.value); 
      $("#id_city").val(ui.item.id); 
      $(this).closest('form').submit(); 
     } 
    }); 
} 

Answer 1

すでに開始されている完了を「中止」できるかどうかはわかりません。しかし、オートコンプリートのレンダー部分を中断することで、あなたが望むものを得ることができるかもしれません。これは、オートコンプリートがクエリとレンダリングで構成され、クエリがネットワークトランザクションを含む場合に機能します。
クエリとレンダリングがあり、クエリがローカルに格納されたリストを介した検索に過ぎない場合は、遅延が小さすぎるため、これはおそらく機能しません。

This SO questionは、jQueryオートコンプリートパッケージのrenderMenuとrenderItem fnsをモンキーパッチする方法を説明しています。私はあなたが同じ猿パッチアプローチを使用できると思っています。

ソースとして、URLではなく関数を指定する必要があります。 This SO questionについて説明します。次に、その関数内で、 "検索が進行中"であるというカウント変数をインクリメントします。次に、 "ajax get"を実行して検索を実行します。また、（a）単一の検索が処理中の場合にのみレンダリングし、（b）検索回数を減らすようにrenderMenuにパッチを適用します。

これはおそらく、次のようになります：

var queriesInProcess = 0; 
var ac = $('#txt_search_city').autocomplete({ 
    minLength: 3, 
    select : .... , 
    // The source option can be a function that performs the search, 
    // and calls a response function with the matched entries. 
    source: function(req, responseFn) { 
     var url = baseUrl + req.term; 
     queriesInProcess++; 
     $.ajax({ 
      url: url, 
      //data: data, 
      success: function(json,xhr) { 
       queriesInProcess--; 
       var a = ....retrieve from the json .... 
       responseFn(a); 
      }, 
      errpr : function() { queriesInProcess--; }, 
      dataType: 'json' 
     }); 
    } 
}); 

ac.data("autocomplete")._renderMenu = function(ul, items) { 
    if (queriesInProcess > 0) return; 
    var self = this; 
    $.each(items, function(index, item) { 
    self._renderItem(ul, item); 
    }); 
}; 

を使用すると、より洗練された取得したい場合は、あなたもabort the pending ajax requestに試すことができます。 これは、ソース関数で発生する必要があります。 $.ajax()コールから返されたXHRをキャッシュに入れておく必要があります。新しいものが届くとabort()に電話してください。