2017-07-01 50 views
1

我目前有一個聊天框,當我的用戶輸入@時,會自動完成自動完成。 但目前的自動完成只與第一個字一起工作,當用戶輸入@theword時如何啓用自動完成功能?自動完成建議在jQuery中由@ @刪除的單詞

對於自動完成:

$("#chat_input").autocomplete({ 
    source: 'search.php' 
}); 

回答

0

您可以自定義搜索方法JQuery ui自動完成,這個想法是創建自己的正則表達式返回任何東西之前,你需要檢查,如果第一個輸入的字母是等於「 @

見工作示例:

var availableTags = [ 
 
    "ActionScript", 
 
    "AppleScript", 
 
    "Asp", 
 
    "BASIC", 
 
    "C", 
 
    "C++", 
 
    "Clojure", 
 
    "COBOL", 
 
    "ColdFusion", 
 
    "Erlang", 
 
    "Fortran", 
 
    "Groovy", 
 
    "Haskell", 
 
    "Java", 
 
    "JavaScript", 
 
    "Lisp", 
 
    "Perl", 
 
    "PHP", 
 
    "Python", 
 
    "Ruby", 
 
    "Scala", 
 
    "Scheme" 
 
]; 
 

 
$("#chat_input").autocomplete({ 
 
    source: function(request, response) { 
 
    var matcher = new RegExp(request.term.substring(1, request.term.length), "i"); 
 
    response($.grep(availableTags, function(item) { 
 
     if (request.term[0] == "@") { 
 
     return matcher.test(item); 
 
     } 
 
    })); 
 
    } 
 

 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> 
 
<link href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css" rel="stylesheet" /> 
 

 
<div class="ui-widget"> 
 
    <label for="chat_input">Tags: </label> 
 
    <input id="chat_input"> 
 
</div>