Hi can anyone help I am trying to develop a function which allows a user to enter search terms and have these highlighted on an a-z page.
I can't see what is wrong with this function - can anyone help?
<script language="javascript" type="text/javascript" >
function textSearch() {
var links = document.getElementsByTagName("a");
var inputText = document.getElementById("formSearchBox");
for (var i=0; i < links.length; i++) {
// if list item is equal to the search term
var linkText = links.firstChild.nodeValue.toLowerCase();
if (linkText.indexOf(inputText.value.toLowerCase()) != -1) {
// add a search class .hilite to the list item
links.setAttribute("class", "hilite");
} else
links.setAttribute("class", "");
}
}
}
</script>
Called from...
<form name="form-search" method="post" action="#">
<p>Type some keywords or a phrase to search this resource</p>
<p>
<input type="text" name="d" id="formSearchBox" onkeyup="textSearch();" />
</p>
</form>
Using this stylesheet...
<style media="screen" type="text/css">
.hilite {
background-color: #FF9;
font-weight:bold;
}
</style>
Thanks
Steven