Javascript 自动完成以第一个字母开始_Javascript_Php_Jquery

Javascript 自动完成以第一个字母开始

javascript php jquery

Javascript 自动完成以第一个字母开始,javascript,php,jquery,Javascript,Php,Jquery,我使用jQuery创建了一个具有自动完成功能的表单我希望Autocomplete显示以键入的字母表开始的选项列表示例：-当我键入'B'时，它应该只显示BASIC，而不显示BASIC、COBOL、RUBY 有关守则如下： <html lang="en"> <head> $( function() { var availableTags = ["ActionScript", "AppleScript", "Asp", "BASIC", "C", "C++",

我使用jQuery创建了一个具有自动完成功能的表单

我希望Autocomplete显示以键入的字母表开始的选项列表

示例：-当我键入'B'时，它应该只显示BASIC，而不显示BASIC、COBOL、RUBY

有关守则如下：

<html lang="en">
<head>
  $( function() {
    var availableTags = ["ActionScript", "AppleScript", "Asp", "BASIC", "C", "C++", "Clojure", "COBOL", "ColdFusion", "Erlang", "Fortran", "Groovy", "Haskell", "Java", "JavaScript", "Lisp", "Perl", "PHP", "Python", "Ruby", "Scala", "Scheme"];
    function split( val ) {
      return val.split( /,\s*/ );
    }
    function extractLast( term ) {
      return split( term ).pop();
    }
    $( "#tags" )
      // don't navigate away from the field on tab when selecting an item
      .on( "keydown", function( event ) {
        if ( event.keyCode === $.ui.keyCode.TAB && $( this ).autocomplete( "instance" ).menu.active ) {
          event.preventDefault();
        }
      })
      .autocomplete({
        minLength: 0,
        source: function( request, response ) {
          // delegate back to autocomplete, but extract the last term
          response( $.ui.autocomplete.filter(
            availableTags, extractLast( request.term ) ) );
        },
        focus: function() {
          // prevent value inserted on focus
          return false;
        },
        select: function( event, ui ) {
          var terms = split( this.value );
          // remove the current input
          terms.pop();
          // add the selected item
          terms.push( ui.item.value );
          // add placeholder to get the comma-and-space at the end
          terms.push( "" );
          this.value = terms.join( ", " );
          return false;
        }
      });
  } );
  </script>
</head>
<body>
<div class="ui-widget">
  <label for="tags">Tag programming languages: </label>
  <input id="tags" size="50">
</div>
</body>
</html>


$（函数（）{
var availableTags=[“ActionScript”、“AppleScript”、“Asp”、“BASIC”、“C”、“C++”、“Clojure”、“COBOL”、“ColdFusion”、“Erlang”、“Fortran”、“Groovy”、“Haskell”、“Java”、“JavaScript”、“Lisp”、“Perl”、“PHP”、“Python”、“Ruby”、“Scala”、“Scheme”]；
功能拆分（val）{
返回val.split（/，\s*/）；
}
功能提取最后（学期）{
返回拆分（term.pop（）；
}
$（“#标签”）
//选择项目时不要离开选项卡上的字段
.on（“按键按下”），功能（事件）{
if（event.keyCode==$.ui.keyCode.TAB&&$（this.autocomplete（“实例”）.menu.active）{
event.preventDefault（）；
}
})
.自动完成({
最小长度：0，
来源：功能（请求、响应）{
//委托回自动完成，但提取最后一项
响应（$.ui.autocomplete.filter(
availableTags，extractLast（request.term））；
},
焦点：函数（）{
//防止在焦点上插入值
返回false；
},
选择：功能（事件、用户界面）{
var术语=分割（此值）；
//删除当前输入
terms.pop（）；
//添加所选项目
术语推送（ui.item.value）；
//添加占位符以在末尾获得逗号和空格
术语。推送（“”）；
this.value=terms.join（“，”）；
返回false；
}
});
} );
标记编程语言：

我哪里出错了？

您需要用您的代码替换下面的代码

 source: function( request, response ) {
          var matcher = new RegExp( "^" + $.ui.autocomplete.escapeRegex( request.term ), "i" );
          response( $.grep( tags, function( item ){
              return matcher.test( item );
          }) );
      }

有关更多信息，请参阅链接

设置

minLength:0，

到

如

minLength:1，

可能重复的