PDA

Click to See Complete Forum and Search --> : Need a page search bar that looks only at headings

Eternity
05-03-2005, 11:48 PM
the things between the H tags. or better still, one that looks at them first then goes on to search the rest of the page. I dunno whether its possible to do such a thing in HTML, a javascript solution would do
hell any solution would do.
Help?
Fang
05-04-2005, 02:26 AM
Not quite sure what the intention is but this will get a list of header content:
function headerData() {
var data='';
for(var h=1; h <=6; h++) {
var searchList=document.getElementsByTagName('h'+h);
data+='headings h'+h+'\n';
for(var i=0; i < searchList.length; i++) {
data+=searchList[i].firstChild.data+'\n';
}
}
alert(data);
}
Eternity
05-04-2005, 08:00 PM
Please explain it to me in much more basic terms? like giving me the exact code i need to paste in? *ahem* Ive no grasp of javascript whatsoever.

I think thats what I want- what its for is so that people can search catagories (which ive put between h3 tags) using a search bar at the top of the page where they type in what they want, and the search will take them to the catagory theyve requested. If i just use a regular search bar it takes them to the first time Ive used the word they search for on my page, and that means theyd end up in the wrong place more often than not.
Fang
05-05-2005, 02:35 AM
See if this works for you:<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<title>h3 menu selection</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<script type="text/javascript">
<!--
onload=function() {
// create a list
var oSelect=document.createElement('select');
var oOption=document.createElement('option');
var txt=document.createTextNode('Jump to >');
oOption.setAttribute('value', 0);
oOption.appendChild(txt);
oSelect.appendChild(oOption);
var h3List=document.getElementsByTagName('h3');
for(var i=0; i<h3List.length; i++) {
h3List[i].id=h3List[i].firstChild.data; // give each h3 an id
oOption=document.createElement('option');
txt=document.createTextNode(h3List[i].firstChild.data);
oOption.setAttribute('value', i+1);
oOption.appendChild(txt);
oSelect.appendChild(oOption);
}
// scroll to the selected option
oSelect.onchange=function() {if(this.selectedIndex) {document.location.href='#'+this[this.selectedIndex].text;}}
// Insert list at top of document
document.getElementsByTagName('body')[0].insertBefore(oSelect, document.getElementsByTagName('h2')[0]);
}
//-->
</script>

<style type="text/css">
<!--
p {height:10em;}
-->
</style>

</head>
<body>
<h2>FRUIT</h2>
<p>bla, bla</p>
<h3>APPLES</h3>
<p>bla, bla</p>
<h3>BANANAS</h3>
<p>bla, bla</p>
<h3>CRANBERRIES</h3>
<p>bla, bla</p>
</body>
</html>
Eternity
05-05-2005, 03:24 PM
Yea... i could use that. Thats not a bad idea. but I have rather a lot of headings. Can ya do the same thing but so as people type in what they want to look for, and the javascript finds it if it is written in a heading and takes them to it the way that one does?

If not that one shall do just as well, Im just being picky now, thank ya for ya help :)