Introduction
It is common to highlight the
searched text, to grab the attention to the searched text. Today I will be
explain how to highlight searched text in asp.net page using JQuery.
Description
When
I type some text on textbox say tbSearchText, and press enter on it.
This will Call JQuery extended function highlight method.
$("[id$='_
tbSearchText']").keypress(function
(e) {
if
(e.which == 13) {
e.preventDefault();
$('#divContent').highlight($(this).val(), "highlight");
}
});
Further
in highlight method we search for the form in Div, where the content exists. If
Searched text found then, particular text is highlighted with class using css highlight.
jQuery.fn.highlight = function (str, className) {
var regex =
new RegExp(str, "gi");
return this.each(function ()
{
this.innerHTML
= this.innerHTML.replace(regex, function (matched) {
return
"<span class=className'>" + matched + "</span>";
});
});
};