如何过滤HTML表格 - JS

  • Z时代
  • 2024-01-10
  • 分类：问答

我有一个输入框（搜索框）来过滤我的html表格。我的查询能够过滤表好吗但是当我清除搜索框不带回了已经存在的数据如何过滤HTML表格 - JS

举例来说，如果我有

MacBook 
Acer

和我搜索对M

它显示MacBook这是很好的

但是当我从搜索框中清除M，表仍然看起来像

的

代替

MacBook 
    Acer

JS

<script> 
$(document).ready(function() { 
     var typingTimer;    //timer identifier 
     var doneTypingInterval = 100; //time in ms (5 seconds) 
     $("#query").on('keyup', function() { 
      clearTimeout(typingTimer); 
      if ($('#query').val()) { 
       typingTimer = setTimeout(doneTyping, doneTypingInterval); 
      } 
     }); 
    }); 
    function doneTyping() { 
     var key = $('#query').val(); 
      $.ajax({ 
       url: 'search/?query='+key, 
       type: 'GET', 
       beforeSend: function() { 
       // $("#table").slideUp('fast'); 
       }, 
       success: function (data) { 
        console.log(data); 
        $("#table").slideDown('fast'); 
        var table = $("#table tbody"); 
         table.html(""); 
         $.each(data, function(idx, elem){ 
          table.append(
           //appending rows here 
          ); 
         }); 
       }    
      }); 
} 
</script>

回答：

此代码：

$("#query").on('keyup', function() { 
     clearTimeout(typingTimer); 
     if ($('#query').val()) { 
      typingTimer = setTimeout(doneTyping, doneTypingInterval); 
     } 
    });

被绑定到keyup事件（OK），但会看，如果$（'＃查询'）具有值：

if ($('#query').val()) {

如果您清空输入字段，则此条件将为false。

只需删除条件，这将工作。

$("#query").on('keyup', function() { 
    clearTimeout(typingTimer); 
    typingTimer = setTimeout(doneTyping, doneTypingInterval); 
});

以上是 如何过滤HTML表格 - JS 的全部内容， 来源链接： utcz.com/qa/262995.html

回到顶部