Question

我正在使用此解决方案使自定义不区分大小写：包含

$.expr[":"].icontains = $.expr.createPseudo(function(arg) {
    return function( elem ) {
        return $(elem).text().toUpperCase().indexOf(arg.toUpperCase()) >= 0;
    };
});

查找并替换突出显示的字符串

的代码

$(function() {
    $("#search").on("keyup", function(e) {
        var q = $(this).val();

        //hide all items
        $("ul#my_list").children("li").hide();
        //show matching
        $("ul#my_list").children('li:icontains("'+q+'")').show();
        $("ul#my_list").children('li').each(function(){
            $(this).html($(this).text());
        });
        $("ul#my_list").children('li:icontains("'+q+'")').each(function(){
            //var content = q;
            this.innerHTML = this.innerHTML.replace(q,"<span class='highlight_text'>"+q+"</span>")
        });
    });
});

我已经尝试了多种解决方案，可以在google和SO上找到包含不区分大小写的解决方案，但它们都不适用于我

小提琴：http://jsfiddle.net/6r1q9rx2/5/

编辑：好像是区分大小写 - 但在这种情况下不会突出显示匹配的文本

Answer 1

您的自定义功能正常运行。什么是无效的是你的替换功能。您的替换功能不区分大小写。

$(this).html(function(_, html){
    return html.replace(
        new RegExp("("+ q + ")", "ig"), // make a regex with capturing group
        "<span class='highlight_text'>$1</span>" // replace with the captured group
    );
});

标志i和g用于告诉引擎分别不区分大小写且不止一次（如果可用）。

然后我们在第1组中捕获它，我们在替换字符串$1

中使用它

DEMO

：包含不区分大小写的解决方案在替换文本以突出显示时不起作用

1 个答案: