Question

这很好用..关于如何显示＆＃34;找不到结果＆＃34; ..

这是我的代码 http://jsfiddle.net/UI_Designer/8p426fog/4/

 $(".my-textbox").keyup(function() {
        var val = $(this).val().toLowerCase()

        $(".personsMenu li").each(function(i) {
            var content = $(this).html();
            if(content.toLowerCase().indexOf(val) == -1) {
              $(this).hide()


            } else {
                $(this).show();



            }
        });
    });

谢谢..

Answer 1

更优雅，最简单的方法是添加额外的变量并将<div class="no-results" style="display:none">no results found</div>添加到DOM中，然后切换块的可见性jsFiddle

var $block = $('.no-results');
$(".my-textbox").keyup(function() {
    var val = $(this).val();
    var isMatch = false;

    $(".personsMenu li").each(function(i) {
        var content = $(this).html();
        if(content.toLowerCase().indexOf(val) == -1) {
           $(this).hide();           

        } else {
            isMatch = true;
            $(this).show();

        }
    });

    $block.toggle(!isMatch);
});

Answer 2

使用以下代码找不到结果。

$(".my-textbox").keyup(function() {
   var val = $(this).val();
   $(".personsMenu li").each(function(i) {
      var content = $(this).html();
      if(content.toLowerCase().indexOf(val) == -1) {
         $(this).hide();
         $(".personsMenu").html("<ul><li><label> NO RESULT FOUND!</label></li></ul>");                  
      } 
      else {
        $(this).show();          
      }
    });
 });

希望这满足您的要求。

如何显示＆＃34;没有找到结果＆＃34;列表在jquery中搜索？

2 个答案: