过滤DIV内容

时间:2012-08-16 09:28:25

标签: javascript jquery

我已经this jsFiddle用于搜索/过滤我从XML响应中获取的div内容。但我已经单独为一个文本框做了这件事。任何人都可以帮我实现下三个?

例如:

如果我正在键入pd001,则会显示前两行,如果我输入粘贴,则应该从当前可见列表到达并过滤,而不是从整个列表中进行过滤。

请帮助我解决这个问题。

2 个答案:

答案 0 :(得分:1)

如果我没有错,那么你一定要做的就是如果我根据pd001搜索2行并将paste放在下一个文本框中,那么它应该只过滤那2行而不是整个网格。并且所有其他文本框的功能相同。实际上你需要依赖文件b / w文本框。

试试这个:

    $(".productid").filter(function () {
        $(this).parent().hide();
        return $(this).text().toLowerCase().indexOf(text0) != -1
    }).parent().show();

    $(".product:visible").filter(function () {
       $(this).parent().hide();
       return $(this).text().toLowerCase().indexOf(text1) != -1; 
    }).parent().show();

    $(".quantity:visible").filter(function () {
       $(this).parent().hide();
       return $(this).text().toLowerCase().indexOf(text2) != -1; 
    }).parent().show();

    $(".amount:visible").filter(function () {
       $(this).parent().hide();
       return $(this).text().toLowerCase().indexOf(text3) != -1; 
    }).parent().show();

演示:http://jsfiddle.net/fbC6w/4/

答案 1 :(得分:0)

您只过滤了一列,它可能会对您有所帮助

$("#searchone , #searchtwo ,#searchthree ,#searchfour").bind("keyup", function() {

    var map = {
        '.productid': $("#searchone").val().toLowerCase(),
        '.product': $("#searchtwo").val().toLowerCase(),
        '.quantity': $("#searchthree").val().toLowerCase(),
        '.amount': $("#searchfour").val().toLowerCase()
    };
    $('div.new').each(function() {
        $(this).hide();
    });
    $('div.new').each(function() {
        var parent_div = this;
        $.each(map, function(key, value) {
            $(parent_div).find(key).filter(function() {
                if ($(this).text().toLowerCase().indexOf(value.toString()) != -1 && value != '') {
                    $(parent_div).show();
                }
            });
        });
    });

});​