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

我有一组机场名称及其代码将显示在自动完成中

例如阿姆斯特登（AMS）

我想匹配在搜索框中输入的值，我想显示匹配的机场名称以及airportcode粗体，如下所示

如果我在搜索框中输入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,"<span style='font-weight:bold;'>" + this.term + "</span>");
        return $( "<li></li>" )
            .data( "item.autocomplete", item )
            .append( "<a>" + t + "</a>" )
            .appendTo( ul );
    };
};

函数（）{
var oldFn=$.ui.autocomplete.prototype.\u renderItem；
$.ui.autocomplete.prototype.\u renderItem=函数（ul，项目）{
var re=新的RegExp（“^”+此术语“i”）；
var t=item.label.replace（re，“+this.term+”）；
返回$（“
”）
.data（“item.autocomplete”，item）
.append（“+t+”）
.附录（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,"<span style='font-weight:bold;'>" + this.term + "</span>");
    return $( "<li></li>" )
        .data( "item.autocomplete", item )
        .append( "<a>" + t + "</a>" )
        .appendTo( ul );
};
};

函数（）{
var oldFn=$.ui.autocomplete.prototype.\u renderItem；
$.ui.autocomplete.prototype.\u renderItem=函数（ul，项目）{
var re=新的RegExp（本术语“ig”）；
var t=item.label.replace（re，“+this.term+”）；
返回$（“
”）
.data（“item.autocomplete”，item）
.append（“+t+”）
.附录（ul）；
};
};

此示例运行良好，请在jsbin中共享您的代码谢谢。我尝试过。但只有机场名称突出显示，但机场代码使用www.jsbin.com共享您的代码，希望我能帮助你对不起，我无法访问JSbin。以上是我的代码。我只是按照你的指示进行替换。根据我的回答，我已经创建了一个演示，它正在按照你的要求工作。