2016-08-02 163 views
0

我正在嘗試JQuery自動完成示例。請參閱 - http://jsfiddle.net/LCv8L/797/Jquery自動完成建議

當我輸入「Ar」時,應先給「Ar」相關項目。但它首先顯示「An」,但我給出了minLength 1.可能是它正在考慮字母順序。有沒有解決這個問題的建議?

minLength: 1, 
    select: function(event, ui) { 
     event.preventDefault(); 
     $("#customer-search").val(ui.item.label); 
     $("#selected-customer").val(ui.item.label); 
    }, 
    focus: function(event, ui) { 
     event.preventDefault(); 
     $("#customer-search").val(ui.item.label); 
    } 
}); 

回答

1

默認情況下包含字符串的自動完成搜索項目不以開頭。

$('#customer-search').autocomplete({ 
    source: function(request, response) { 
     var filtered = $.map(data, function(item) { 
      if(item.value.toLowerCase().startsWith(request.term.toLowerCase())) { 
       return item; 
      } 
      else { 
       return null; 
      } 
     }); 
     response(filtered); 
    } 
}); 
+0

startsWith將不支持某些瀏覽器 –

+0

這不適用於主題。很容易用'this.indexOf(needle)== 0'來檢查和替換。 –

+0

是的。它更好地提供了一個很好的解決方案,因爲你說或其他item.match!== null :) –

1

嘗試在「搜索」方法中更改名稱空間中的正則表達式。

請jsfiddle.net/LCv8L/800/找到答案

+0

謝謝,我無法理解的變化,請你詳細說明 – user123

+0

正如我所說我們可以手動進行搜索查詢並返回源響應通過使用正則表達式。在這裏,他們綁定了一個源代替JSON數組的方法,並且每次通過匹配給定輸入的正則表達式進行過濾來返回源 –

1

運行這段代碼在你的jsfiddle 這是工作,只要你想.. :) //使用正則表達式是更好的方法來防止這種情況。

var wordlist= [ 
     "Afghanistan", 
     "Albania", 
     "Algeria", 
     "American Samoa", 
     "Andorra", 
     "Angola", 
     "Anguilla", 
     "Antarctica", 
     "Antigua and Barbuda", 
     "Argentina", 
     "Armenia", 
     "Aruba", 
     "Australia", 
     "Austria", 
     "Azerbaijan" 
    ] ; 

    $("#customer-search").autocomplete({ 

     source: function(req, responseFn) { 
      var re = $.ui.autocomplete.escapeRegex(req.term); 
      var matcher = new RegExp("^" + re, "i"); 
      var a = $.grep(wordlist, function(item,index){ 
       return matcher.test(item); 
      }); 
      responseFn(a); 
     } 
    });