posted 20 years ago
Hello,
I'm trying to do expandable javascript tree view, but it does not work with mozilla and netscape. Can someone help me which way do i have to modify the javascript code ?
Here is my example:
MS IExplorer has no problems expanding and collapsing the tree after clicking on the text SUB, but what about Mozilla or Netscapoe ?
My problem is, i can't use getElementById, because in my document are more tags with the same id. I have to lookup in <li> childs, there can be only one tag with the id.
TREEVIEW.HTML:
<html>
<head>
</head>
<body>
<SCRIPT LANGUAGE="JavaScript">
function clickHandler() {
var targetId, srcElement, targetElement;
//this one may be IE specific, but i think something else is also
srcElement = window.event.srcElement;
if (srcElement.className == "Outline") {
targetId = srcElement.id + "d";
childs = srcElement.childNodes;
for(i=0; i<childs.length; i++) {
if (childs[i].id == targetId) {targetElement = childs[i];}
}
if (targetElement.style.display == "none") {
targetElement.style.display = "";
} else {
targetElement.style.display = "none";
}
}
}
document.onklick = clickHandler; //onklick= o n c l i c k
</SCRIPT>
<ul id="rootd">
<li class="Outline" id="sub1">SUB1
<ul id="sub1d">
<li>nod1
<li>nod2
<li class="Outline" id="sub2">SUB2
<ul id="sub2d">
<li>nod4
<li>nod5
<li>nod6
</ul>
<li>nod3
</ul>
<li class="Outline" id="sub2">SUB2
<ul id="sub2d">
<li>nod4
<li>nod5
<li>nod6
</ul>
<li class="Outline" id="sub3">SUB3
<ul id="sub3d">
<li>nod4
<li>nod5
<li>nod6
</ul>
</ul>
</body>
</html>
Regards
Mir