Question

我正在尝试使用多个列按多个名称对数据进行排序。例如：

Search Box:  A,B,Good

输出：

Item Qty Type
A    525  Good
A    145  Good
B    150   Good

HTML：

<table id="table">
  <tr>
    <th>Item</th>
    <th>Qty </th>
    <th>Type</th>
  </tr>
  <tr>
    <td>A</td>
    <td>525</td>
    <td>Good</td>
  </tr>
  <tr>
    <td>A</td>
    <td>145</td>
    <td>Good</td>
  </tr>
  <tr>
    <td>B</td>
    <td>250</td>
    <td>Bad</td>
  </tr>
  <tr>
    <td>C</td>
    <td>152</td>
    <td>Bad</td>
  </tr>
  <tr>
    <td>D</td>
    <td>250</td>
    <td>Poor</td>
  </tr>
  <tr>
    <td>B</td>
    <td>150</td>
    <td>Good</td>
  </tr>
</table>

jQuery的：

  var $rows = $('#table tr');
    $('#search').keyup(function(){
          var term = $(this).val();
          if(term.trim().length == 0){
            // Show everything if no text is present
            $('#table tr').show();
          }
          else{
            // Build your selectors (map each term to a contains statement)
            var selectors = term.split(',').map(function(t){
              return '#table tr:contains("' + t + '")';
            });
            // Hide all of your rows and then target the selectors to display them
            $("#table tr").hide().filter(selectors.join(',')).show();
          }

    });

我写了一个代码，但是当你输入A时，它会隐藏A并显示else。有些东西是错的。请帮我弄明白。
提前致谢。

Answer 1

试试这个

$('#search').keyup(function(){
      var term = $(this).val();
      if(term.trim().length == 0){
        $('#table tr').show();
      }
      else{
        var arr = term.split(',');
        var row = $('#table tr').filter(function() {
                     return $(this).find('td').filter(function(){
                        return jQuery.inArray( $(this).text(), arr ) > -1; 
              }).length > 0;
        });
        $("#table tr").hide();
        $(row).show();
      }

});

这是小提琴示例https://jsfiddle.net/ekwdgu8w/5/

使用jQuery在一个文本框中过滤多个列的多个名称

1 个答案: