0

当我搜索年龄将隐藏的名称时，我在实时搜索中遇到问题。我想要的是只有名字可以搜索它。然后年龄没有出现。

请检查我的代码。

这是我的html

<table class="AvailableGroupLab availGrpLabs avalLabs">
    <tr>
        <th>Name</th>
        <th>Age</th>
    </tr>

    <tr>
    <td><span>wewe</span></td>
    <td>16</td>
    </tr>

    <tr>
    <td><span>Melvin</span></td>
    <td>18</td>
    </tr>

    <tr>
    <td><span>Marvin</span></td>
    <td>20</td>
    </tr>
</table>

这是我的jQuery

  <script type="text/javascript">
var span = $(".AvailableGroupLab").clone().html();
function filter(element) {
    $('.AvailableGroupLab').html(span);
    var value = $(element).val().toLowerCase();
    $(".AvailableGroupLab span").each(function () {
        if ($(this).text().toLowerCase().search(value) == -1) {
            $(this).remove();
        }
    });
}
       </script>
4

3 回答 3

1

尝试

function filter(element) {
    var $trs = $('.AvailableGroupLab tr').hide();
    var regexp = new RegExp($(element).val(), 'i');

    var $valid = $trs.filter(function () {
        return regexp.test($(this).find('td:first-child').text())
    }).show();

    $trs.not($valid).hide()
}

演示：小提琴

于 2013-08-30T03:49:34.250 回答
0 
    $("#src").keyup(function() {

    var val = $(this).val().toLowerCase();

    $(".name").hide();

       $(".name").each(function() {

        var text = $(this).text().toLowerCase();

         if(text.indexOf(val) != -1)
         {

             $(this).show(); 

         }

       });

    });
于 2016-03-04T17:58:08.203 回答
0

$(文档).ready(函数() {

/ ---- 在这里我们 FDEOUT 并隐藏 GRABL 产品列表和价格的 DIV ---- /

    $(".col-md-9 .show_this_li").fadeOut(500);

/ ---- 这里我们开始搜索功能---- /

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

    $(".col-md-9 .show_this_li").fadeIn(500);

/ ---- 在这里我们淡出并隐藏第一个 DIV，其中包含 CATS 标题的 GRABL 列表 ---- /

    $(".col-md-9 .hide_this").fadeOut(200);

    $('.clear_src').html("<h6>Clear Search</h6>");

/ --- 获取搜索字段文本值 ---- /

     var val = $(this).val().toLowerCase();

      $(".hover").fadeOut(200);

      $('.error').html("").fadeIn(100);

       $(".hover").each(function() {

        var text = $(this).text().toLowerCase();

/ ---- 使用 LI 产品检查搜索字段文本 ---- /

     if(text.indexOf(val) != -1)
         {

             $('.error').html("<h6>Please Wait...</h6>").fadeOut(200);
             $(this).fadeIn(300); 

         }else {
                //$('.error').html($('<h5/>').text("No Data Found"));       
            }



       });

    });

/ ---- 当用户离开搜索字段并且字段为空时，我们在这里 FADEIN 并显示带有猫的列表 ---- /

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

   var val = $(this).val();

     if(val.length<1)
      {

            $(".col-md-9 .hide_this").show(1000);
            $(".col-md-9 .show_this_li").fadeOut(500);
            $('.error').html("<h6>Refressing...</h6>").fadeOut(200);

      } 

  });
于 2016-03-04T19:10:10.647 回答