Question

我有一个包含两个过滤器的表，一个搜索框和一个选择框。最后，我希望搜索框过滤器只搜索由选择框过滤的表条目。

例如：在选择框中选择了待定资格，因此仅显示具有待定资格的行（其余部分被隐藏）。当我搜索时我只想搜索可见的行。

理想情况下，我想在.each(function(e))

之前添加另一个条件

我试过了，但它似乎没有用。

CSS

.hidden {
    display:none;
}

这是containsi

$.extend($.expr[':'], {
    'containsi': function (elem, i, match, array) {
        return (elem.textContent || elem.innerText || '').toLowerCase()
        .indexOf((match[3] || "").toLowerCase()) >= 0;
    }
});//end of case insensitive chunk

以下尝试不起作用

所有这些仍会过滤所有数据

$("#filterItems .hideThis").not(":containsi('" + searchSplit + "'):contains('"+ selectValue + "')").each(function (e) {
    //add a "hidden" class that will remove the item from the list
    $(this).addClass('hidden');
});

下一步

$("#filterItems .hideThis").not(":containsi('" + searchSplit + "')").each(function (e) {
    if($("#filterItems .hideThis:contains('" + selectValue + "')")){
       //add a "hidden" class that will remove the item from the list
       $(this).addClass('hidden');
    }
});

我也厌倦了检查.hidden

$("#filterItems .hideThis").not(":containsi('" + searchSplit + "')").each(function (e) {
    if(!($(this).hasClass('hidden'))){
        //add a "hidden" class that will remove the item from the list
        $(this).addClass('hidden');
    }
});

当前JSFiddle如果你想看到它

Answer 1

你让它变得复杂，我建议：

$('#select-Qualification').on('change', filter).change();
$("#search-text").on('keyup', filter).keyup();

function filter() 
{
    var selectValue = $('#select-Qualification').val();
    var query = $.trim($("#search-text").val()).toLowerCase();

    // filter based on the select's value
    var $col = $("#filterItems .hideThis").addClass('hidden').filter(function () {
        return $('td:eq(3)', this).text() === selectValue;
    });

    // filter based on the search input's value
    if (query.length) {
        $col = $col.filter(function() {
           return $(this).text().toLowerCase().indexOf(query) > -1;
        });
    }

    $col.removeClass('hidden');
}

http://jsfiddle.net/5LaxC/

为.each（）添加两个包含

1 个答案: