搜索框立即过滤html表？

Question

我有一个HTML表，它从MySQL DB中提取出来......

ID  NAME             COST    POSITION  SCORE
1   John Johnson     4.5     Mid       28
2   Mark Markson     6.1     Atk       41
3   Larry Lawrenson  5.6     Def       38    
4   Paul Paulson     5.4     Mid       32

等...

我希望在这个表格的顶部有一个搜索框，可以立即根据您输入的内容过滤数据（即时 - 如同，无需按下提交框或任何内容）。例如，如果您在搜索框中输入Mid，则只会显示上述两个用户，其余用户将无法查看。

我尝试使用谷歌搜索“聚光灯搜索php”，但我发现的所有搜索都是google.com或apple.com风格，它会为您提供搜索列表，而不是过滤屏幕上已有的表格。

This看起来很有希望......它会做我想做的事吗？

有没有人有任何提示或链接到某个地方这样做？或者即使我称之为正确的名称。另外，如果我的要求不清楚，请告诉我，我会尽力澄清。

Answer 1

我相信这就是你要找的东西。

http://www.datatables.net/release-datatables/examples/basic_init/zero_config.html

dataTables将搜索当前的html表，并仅显示与搜索词匹配的行（不区分大小写）。这默认情况下启用了排序。您可以将其配置为不进行排序。

Answer 2

是的，您引用的文章应该可以实现您的目标。

您也可以考虑使用jQuery Autocomplete plugin回拨您的服务器。 服务器可以使用来自相应行的数据来响应该查询。