在搜索/过滤脚本中添加“无结果”

Question

是的，我知道......另一个“没有结果”的问题......对此很抱歉，但我需要问一下，因为我现在已经和它斗争了几个小时，而且几乎没有任何效果。

我有一些脚本来过滤项目，我需要你的帮助来注入一些代码来显示“无结果”消息。

$("#my-search-input").keyup(function() {
    var search = $(this).val();
    $(".my-list").children().show();
    if (search)
       $(".my-list").children().not(":containsNoCase(" + search + ")").hide();
});


$.expr[":"].containsNoCase = function (el, i, m) {
    var search = m[3];
    if (!search) return false;
       return new RegExp(search,"i").test($(el).text());
};

这是我的小提琴： http://jsfiddle.net/bk13detv/22/

基本上消息应该显示在表格的每个实例中。

感谢您的宝贵时间，干杯。

Answer 1

你可以试试这样的：

    $("#my-search-input").keyup(function () {
        var search = $(this).val();
        $(".my-list").children().show();
        $('.noresults').remove();
        if (search) {
            $(".my-list").children().not(":containsNoCase(" + search + ")").hide();
            $(".my-list").each(function () {
                if ($(this).children(':visible').length == 0) 
                    $(this).append('<tr class="noresults"><td colspan="3"><em>No Results</em></td></tr>');
            });

        }
    });

请参阅此Fiddle 以获取演示。