Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
branch: master
Fetching contributors…

Cannot retrieve contributors at this time

149 lines (143 sloc) 4.723 kb
<!DOCTYPE>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>jQuery highlightText Plugin Demo</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<script src="jquery.highlightText.js"></script>
<style>
th,td {text-align:left;}
.mark{background-color:yellow;color:black;}
</style>
</head>
<body>
<h1>Simple Text Highlighting via Unobtrusive JavaScript</h1>
<h2>My CD Collection</h2>
<table>
<thead>
<tr>
<th>Title</th>
<th>Artist</th>
</tr>
</thead>
<tbody data-highlight-word="an">
<tr>
<td>Empire Burlesque</td>
<td>Bob Dylan</td>
</tr>
<tr>
<td>Hide your heart</td>
<td>Bonnie Tyler</td>
</tr>
<tr>
<td>Greatest Hits</td>
<td>Dolly Parton</td>
</tr>
<tr>
<td>Still got the blues</td>
<td>Gary Moore</td>
</tr>
<tr>
<td>Eros</td>
<td>Eros Ramazzotti</td>
</tr>
<tr>
<td>One night only</td>
<td>Bee Gees</td>
</tr>
<tr>
<td>Sylvias Mother</td>
<td>Dr.Hook</td>
</tr>
<tr>
<td>Maggie May</td>
<td>Rod Stewart</td>
</tr>
<tr>
<td>Romanza</td>
<td>Andrea Bocelli</td>
</tr>
<tr>
<td>When a man loves a woman</td>
<td>Percy Sledge</td>
</tr>
<tr>
<td>Black angel</td>
<td>Savage Rose</td>
</tr>
<tr>
<td>1999 Grammy Nominees</td>
<td>Many</td>
</tr>
<tr>
<td>For the good times</td>
<td>Kenny Rogers</td>
</tr>
<tr>
<td>Big Willie style</td>
<td>Will Smith</td>
</tr>
<tr>
<td>Tupelo Honey</td>
<td>Van Morrison</td>
</tr>
<tr>
<td>Soulsville</td>
<td>Jorn Hoel</td>
</tr>
<tr>
<td>The very best of</td>
<td>Cat Stevens</td>
</tr>
<tr>
<td>Stop</td>
<td>Sam Brown</td>
</tr>
<tr>
<td>Bridge of Spies</td>
<td>T`Pau</td>
</tr>
<tr>
<td>Private Dancer</td>
<td>Tina Turner</td>
</tr>
<tr>
<td>Midt om natten</td>
<td>Kim Larsen</td>
</tr>
<tr>
<td>Pavarotti Gala Concert</td>
<td>Luciano Pavarotti</td>
</tr>
<tr>
<td>The dock of the bay</td>
<td>Otis Redding</td>
</tr>
<tr>
<td>Picture book</td>
<td>Simply Red</td>
</tr>
<tr>
<td>Red</td>
<td>The Communards</td>
</tr>
<tr>
<td>Unchain my heart</td>
<td>Joe Cocker</td>
</tr>
</tbody>
</table>
<p>
<em>Copied the list above from <a href="http://www.w3schools.com/xsl/">W3Schools' XSLT tutorial</a>.</em>
</p>
<script>
$("*[data-highlight-word]").each(function() {
var highlightWord = $(this).attr('data-highlight-word');
var regExp = new RegExp(highlightWord, 'gi');
$(this).find('td').filter(function() { if(null !== $(this).text().match(regExp)) {return this;} }).each(function() {
$(this).highlightText(highlightWord);
});
});
</script>
</body>
</html>
Jump to Line
Something went wrong with that request. Please try again.