javascript - How to highlight an entire div based on search -


i have sample jsfiddle here.

you'll see have several div classes created. can search text , highlighted answer, want able search value of div , have entire div (a square box in case) highlight or fill color.

here's javascript have isolating text, can't above issue work...

function dosearch(text) {     if (window.find && window.getselection) {         document.designmode = "on";         var sel = window.getselection();         sel.collapse(document.body, 0);          while (window.find(text)) {             document.getelementbyid("button").blur();             document.execcommand("hilitecolor", false, "yellow");             sel.collapsetoend();         }         document.designmode = "off";     } else if (document.body.createtextrange) {         var textrange = document.body.createtextrange();         while (textrange.findtext(text)) {             textrange.execcommand("backcolor", false, "yellow");             textrange.collapse(false);         }     } } 

can done more appropriately jquery?

i forked fiddle here. added 1 line of css (a new class: highlight) , shrunk down dosearch() function these 2 lines of jquery:

$('#content div').removeclass('highlight'); $('#content div:contains(' + text + ')').addclass('highlight'); 

it first removes highlight class every div inside content div, adds class of divs contain desired text.


Comments

Popular posts from this blog

design - Custom Styling Qt Quick Controls -

Unable to remove the www from url on https using .htaccess -