jQuery Mobile Search隐藏搜索选项

Question

我希望在输入内容之前不会显示任何搜索内容。我隐藏了类，然后在搜索项目时使用.show（），但它无效。

演示：http://jsfiddle.net/DyYFb/207/

JS：

$("#search").keyup(function(){

var SEARCHWORD = this.value;
$("#list li").each(function(){

    if($(this).
          find("h3, p").
          text().toUpperCase().
          indexOf(SEARCHWORD.toUpperCase()) >=0)
   $(this).show();
    else
   $(this).hide();

});


});

Answer 1

这是您可能正在寻找的jsFiddle Example

我只是添加了你的代码所以我没有很好地格式化它。您可以更改.slideUp()和.slideDown()。我更喜欢他们。

$('#list li').hide(0); //Hide the elements initially

$("#search").keyup(function(){

    var SEARCHWORD = $.trim(this.value);

    if(SEARCHWORD === ""){            //Checks if Search Term is Nothing and starts over
        $('#list li').slideUp(150); 
        return false;
    } 

    $("#list li").each(function(){

    if($(this).
          find("h3, p").
          text().toUpperCase().
          indexOf(SEARCHWORD.toUpperCase()) >=0)
     $(this).slideDown(150);
    else
      $(this).slideUp(150);

 });

}）;