tự động hoàn thành khớp chính xác từ khi bắt đầu sử dụng tính năng tự động hoàn thành jquery từ mảng đơn

Question

Làm cách nào để bật kết hợp chính xác từ khi bắt đầu chuỗi bằng cách sử dụng tính năng tự động hoàn thành bằng đầu vào từ mảng đơn?

Nếu tôi có những điều sau đây trong một mảng:

• thông minh
• oversmart
• smartland
• undersmart
• verysmart

Và nếu tôi gõ "sma. .. "trong văn bản đầu vào, tôi phải được hiển thị chỉ thông minh và smartland, không phải là khác.

Answer 1

Bạn chỉ cần sửa đổi thông số nguồn làm chức năng cho phù hợp với nhu cầu của mình. Như thế này:

http://jsfiddle.net/UKgD6/

---

Cập nhật: Thêm mã để trả lời:

var acList = ['smart', 'oversmart', 'smartland', 'undersmart', 'verysmart']; 
$('#ac').autocomplete({ 
    source: function (request, response) { 
     var matches = $.map(acList, function (acItem) { 
      if (acItem.toUpperCase().indexOf(request.term.toUpperCase()) === 0) { 
       return acItem; 
      } 
     }); 
     response(matches); 
    } 
}); 

Answer 2

Bạn có thể sử dụng cụm từ thông dụng để khớp với chuỗi con đã nhập với các giá trị trong mảng bạn có.

Answer 3

JQuery có quá nhiều plug-ins. Chỉ cần rắc một ít regex vào nó và viết một cái gì đó như thế này (tôi đã không kiểm tra nó, nhưng tôi đã thực hiện công cụ tương tự trước đó):

$('#someTextInput').keyup(function(){ 
    var regExMatch = new RegEx('^' + $(this).val()); 
    $_LIs = $('#someUl li'); 
    $_LIs.hide(); 
    $_LIs.each(function(){ 
     if(this.innerText.match(regExMatch)) { $(this).show(); } 
    }); 
}); 

Bạn có thể loại bỏ các '^' + trong các thông số new RegEx để khôi phục lại hoạt động bạn đang mô tả là có vấn đề. '^' biểu thị sự bắt đầu của một lựa chọn dòng/chuỗi nên 's' sẽ không khớp trừ khi nó bắt đầu.

Answer 4

Điều này đã thay đổi kể từ khi câu trả lời trước được chấp nhận. Hiện tại có một tùy chọn lookupFilter để làm điều này và nó đơn giản hơn rất nhiều. Từ https://stackoverflow.com/a/23239873/1204434, chỉ cần thêm này vào danh sách các tùy chọn:

lookupFilter: function (suggestion, originalQuery, queryLowerCase) { 
       return suggestion.value.toLowerCase().indexOf(queryLowerCase) === 0; 
      }, 

Answer 5

Cách để làm điều này là tài liệu tại http://api.jqueryui.com/autocomplete/

<script> 
    var tags = [ "c++", "java", "php", "coldfusion", "javascript", "asp", "ruby" ]; 
    $("#autocomplete").autocomplete({ 
     source: function(request, response) { 
       var matcher = new RegExp("^" + $.ui.autocomplete.escapeRegex(request.term), "i"); 
       response($.grep(tags, function(item){ 
        return matcher.test(item); 
       })); 
      } 
    }); 
</script>