如何在表中为jquery进行多次搜索

时间:2013-12-05 09:35:00

标签: javascript jquery

我希望我在jsfiddle中的代码可以进行多次搜索。这是我的代码: 当我搜索55。它正在工作。但如果我搜索“55 553”是否可以突出显示两行呢?

$('#search').keyup(function(){
    var needle = $(this).val();
    $('.highlight').removeClass('highlight');
    $('td.hidden:contains("' + needle + '")')
        .filter(function(){
            return $(this).text() == needle;
        })
        .closest('tr')
        .addClass('highlight');
});

http://jsfiddle.net/davidThomas/AsSDQ/1/

而不是突出显示行,我想隐藏不属于搜索

的表行

2 个答案:

答案 0 :(得分:1)

   $('#search').keyup(
function () {
    var needles = $(this).val().split(" ");
   $("tr").hide();
        $('.highlight').removeClass('highlight');

    for (i = 0; i < needles.length; i++) {
        $('td.hidden:contains("' + needles[i] + '")')
        .filter(
            function () {
                return $(this).text() == needles[i];
            })
        .closest('tr')
        .addClass('highlight');
    }
    $('.highlight').show();
    if($(this).val()=="")
     {
        $("tr").show()
     }
});

此代码可以正常工作..

Demo

答案 1 :(得分:1)

这应该是您正在寻找的答案

JS Fiddle here这就是答案,我不确定如何在这里发布答案,我尝试了它并没有真正解决。

$('#search').keyup(
    function(){
       var needle = $(this).val();
       var splitNeedle = needle.split(" ");
       $('.test').html(splitNeedle.length)
       $('.highlight').removeClass('highlight');
       for(var i=0;i<splitNeedle.length;i++){
       $('td.hidden:contains("' + splitNeedle[i] + '")')
            .filter(
                function(){
                    return $(this).text() == splitNeedle[i];
                })
            .closest('tr')
            .addClass('highlight');
        }
});