如何使用jQuery构建简单的表格过滤器？

如何使用jQuery构建一个具有良好效果的简单表格过滤器？ 我不介意分页。如何使用jQuery构建简单的表格过滤器？

list - >选择数据库的数据。

我不想使用插件，我更喜欢使用短代码。

实施例： Table Filter With JQuery

来源

2011-08-13 Sheikhasa Mozali

你的意思是用'好Effect'？到目前为止，如果你不需要插件，你有什么？ – pimvdb

@pimvdb - hide（）效果'。我不能使用插件，因为我的代码尺寸很大。 –

我明白了，但你的问题有点宽泛。它与'为我编写代码'问题没有多大区别，这不是Stack Overflow的原因。您可能想要显示一些代码以获取帮助。 – pimvdb

$('#inputFilter').keyup(function() { 
    var that = this; 
    $.each($('tr'), 
    function(i, val) { 
     if ($(val).text().indexOf($(that).val()) == -1) { 
      $('tr').eq(i).hide(); 
     } else { 
      $('tr').eq(i).show(); 
     } 
    }); 
});

CHECH THIS

来源

2011-08-13 17:13:45 thecodeparadox

请在http://jsfiddle.net给我例子。这是否适用于所有“分页”？ –

@Sheikhasa Mozali我给了你小提琴。请检查 – thecodeparadox

为什么消失？ – Sashka

尝试测试行的innerHTML到输入字段的值，显示/隐藏取决于测试结果的内容。

$('#test').bind('keyup', function() { 
    var s = new RegExp(this.value); 
    $('tr').each(function() { 
     if(s.test(this.innerHTML)) $(this).show(); 
     else $(this).hide(); 
    }); 
});

JSFIDDLE与实例表和输入字段。

编辑

这可能是更好地使用.text()而不是innerHTML的。 Performancewise innerHTML会更好，但.text()不接受html标签作为有效的搜索结果。 JSFIDDLE＃2。

来源

2011-08-13 17:00:57 rsplak

如果有'分页'这项工作的所有数据或只为'分页'的同一页？（我想工作'分页所有页面' ）还行吧？ –

这只适用于当前表格页面。因此，如果您位于第5页上，则只会找到并过滤第5页上的结果。 – rsplak

我通常不帮忙这一点，但我觉得无聊今天上午..

http://jsfiddle.net/hHJxP/

来源

2011-08-13 17:23:33 Jacksonkr

如何使用jQuery构建简单的表格过滤器？

回答

相关问题