在javascript / jquery中自动完成时突出显示匹配的字母

我有一组机场名称及其代码,以便在自动填充中显示。

例如Amsterdem(AMS)

我想匹配搜索框中输入的值,我想显示匹配的机场名称以及机场代码粗体,如下所示。

如果我在搜索框中输入ams ,我想在我的自动填充中突出显示’Ams’terdem(’ AMS ‘)。

我编写了如下代码:

function () { var oldFn = $.ui.autocomplete.prototype._renderItem; $.ui.autocomplete.prototype._renderItem = function( ul, item) { var re = new RegExp("^" + this.term, "i") ; var t = item.label.replace(re,"" + this.term + ""); return $( "
  • " ) .data( "item.autocomplete", item ) .append( "" + t + "" ) .appendTo( ul ); }; };

    结果是’Ams’terdem(AMS)而不是’Ams’terdem( AMS )。

    注意:Amsterdem(AMS)是一个单项

    请指教。

    你必须改变

     var re = new RegExp("^" + this.term, "i") ; 

    用这个代码

     var re = new RegExp(this.term, "ig") ; 

    这将替换字符串中的所有实例

    “^”表示字符串的开头,正则表达式中的“g”适用于所有实例

    这是工作的例子

    用这个替换你的代码

     function () { var oldFn = $.ui.autocomplete.prototype._renderItem; $.ui.autocomplete.prototype._renderItem = function( ul, item) { var re = new RegExp(this.term, "ig") ; var t = item.label.replace(re,"" + this.term + ""); return $( "
  • " ) .data( "item.autocomplete", item ) .append( "" + t + "" ) .appendTo( ul ); }; };