页内结果实时搜索

我需要一个搜索框，它会像CTRL + F的工作方式一样抛出结果。 现在，在我的index.php页面上，我有ff格式：

  <tr id="">  
 
 
 
Client Name:
 
Nationality:
 
Birthday:
 
Address:
 
Gender:
 
Birthplace:
 
 
  
  
 
  
 
  
 
  
 
  
 
 
   

我已经尝试了很多JQuery和Ajax教程，但是没有一个教程似乎可以正常工作。 所以我得出结论，也许那些教程只有在你有一个预定义的表行值时才能工作。 像这样的例如：

 ClientName 

无论如何，我可以在我的索引页面上搜索CTRL + F作为表行吗？

Answer 1

Javascript，尤其是与jQuery结合使用，非常容易学习和理解。 不需要插件或教程。

如何搜索表格？

这是我刚刚为你写的一个jsfiddle：

http://jsfiddle.net/j9U52/

 $('#search-submit').on('click', function(event) { var v = $('#search-value').val(); // get the search value var t = $('.searchable td'); // WHERE to search var c = 'highlight'; // css class to add to the found string // for each td in the table $.each(t, function(idx, el) { // find the keyword var regex = new RegExp("\\b" + v + "\\b", "gi"); // replace it and add a span with the highlight class el.innerHTML = el.innerHTML.replace(regex, function(matched) { return "" + matched + ""; }); }); }); 

当你输入一个新的搜索关键字时，我没有添加重置突出显示的匹配项，我把它留给你:-)提示：添加类似t.removeClass(c);