1

フォームにオートコンプリート機能を使用しています。以下の jquery スクリプトを使用して、オートコンプリート機能を実装しました。

<script>
$( "#autocomplete" ).autocomplete({
  source: [ "c++", "java", "php", "coldfusion", "javascript", "asp", "ruby" ]
});
</script>

上記のコードから得られる o/p は、入力ボックスに入力している文字に関連するすべての単語をフェッチします。例: 「C」と入力すると、C を含むすべての単語が取得されます。ただし、C だけで始まる単語が必要です。

HTML 部分は次のとおりです。

<label for="tags">Tags: </label>
  <input id="tags" />

これについて誰か助けてください....ありがとう

4

2 に答える 2

3

HTML 部分 :

 <label for="tags">Tags: </label>
 <input id="tags" />

次のように置き換えます。

<label for="autocomplete">Tags: </label>
  <input id="autocomplete" />

そしてJsパート

 <script>
 $( "#autocomplete" ).autocomplete({
    source: [ "c++", "java", "php", "coldfusion", "javascript", "asp", "ruby" ]
 });
</script>

に置き換えます:

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

それが動作します

デモ

于 2013-09-17T09:43:17.767 に答える
1

以下のコードを試してください：

<title>Autocomplete</title>
<body>
 <label for="tags">Tags: </label>
 <input id="tags">
</body>

Javascript:

var availableTags = [
 "ActionScript",
 "AppleScript",
 "Asp",
 "BASIC",
 "C",
 "C++",
 "Clojure",
 "COBOL",
 "ColdFusion",
 "Erlang",
 "Fortran",
 "Groovy",
 "Haskell",
 "Java",
 "JavaScript",
  "Lisp",
  "Perl",
  "PHP",
 "Python",
 "Ruby",
 "Scala",
 "Scheme"
];
$( "#tags" ).autocomplete({
   source: function( request, response ) {
    var matches = $.map( availableTags, function(tag) {
      if ( tag.toUpperCase().indexOf(request.term.toUpperCase()) === 0 ) {
       return tag;
     }
    });
   response(matches);
 }
});

copiedjQueryフォーラムからこのスクリプトを入手しました。

以下は同じためのJsFiddleです。

于 2013-09-17T09:59:13.627 に答える