Chocolate570 Posted December 1, 2006 Share Posted December 1, 2006 I am currently trying to make a tree menu. Unfortunately, my simple code right now (I just started) refuses to work, and I have absolutely no clue why.Could anyone help me with this please? <html><head><script type="text/javascript">function tre_men() { alert("here");}</script></head><body><div class="parent"><div class="header">Testing Stuff Here</div><div class="header">Testing Stuff Here</div><div class="header">Testing Stuff Here</div></div><script type="text/javascript">///////////////////////////////// Organic.Tree.Menu //// Made by Chocolate570 //// Current Version Details //// [0.1 Beta] ///////////////////////////////////Start Menu//////////Attribute Setter//////////divHl=document.getElementsByTagName("div");for(i=0;i<divHl.length;i++) { if(divHl[i].className=="parent") { inDiv=divHl[i].getElementsByTagName("div"); for(j=0;j<inDiv.length;j++) { if(inDiv[j].className=="header") { heHl=inDiv[j]; heHl.onclick="alert('lol')";} } } }////////////////////////////////////</script></body></html> It's supposed to loop through all of the div elements, find a parent div, then loop through that div's elements and check for a menu header div. If it's found it, the function should set the div's onclick to alert, and then go through again.My function works fine, except for the fact that when the div is clicked, nothing happens. :|Thanks.ChocoP.S.: Here's a link to the tryit editor:Tryit EditorThanks. Link to comment Share on other sites More sharing options...
adservio Posted December 1, 2006 Share Posted December 1, 2006 (edited) With aspnetguy's help below(next post): <div id="p" class="parent"><div id="a" class="header">Testing Stuff Here</div><div id="b" class="header">Testing Stuff Here</div><div id="c" class="header">Testing Stuff Here</div></div><script type="text/javascript">///////////////////////////////// Organic.Tree.Menu //// Made by Chocolate570 //// Current Version Details //// [0.1 Beta] ///////////////////////////////////Start Menufunction testThis(e) { var targ; if (!e) var e = window.event; if (e.target) targ = e.target; else if (e.srcElement) targ = e.srcElement; if (targ.nodeType == 3) // defeat Safari bug targ = targ.parentNode;alert(targ.id); }//////////Attribute Setter//////////divHl=document.getElementsByTagName("div");for(i=0;i<divHl.length;i++) {if(divHl[i].className=="parent") {inDiv=divHl[i].getElementsByTagName("div");for(j=0;j<inDiv.length;j++) {if(inDiv[j].className=="header") {heHl=inDiv[j];heHl.onclick = testThis;} } } }////////////////////////////////////</script> Tested in IE, FF O Edited December 1, 2006 by adservio Link to comment Share on other sites More sharing options...
aspnetguy Posted December 1, 2006 Share Posted December 1, 2006 this is your problem heHl.onclick="alert('lol')"; you must set onclick to a function not a string.like so heHl.onclick=functionName; //use if not passing variables to function or heHl.onclick=function(){functionName(var1)};//use if passing variables to function Link to comment Share on other sites More sharing options...
Chocolate570 Posted December 1, 2006 Author Share Posted December 1, 2006 After studying these 2 sources:add onclick eventtarget of event<div id="p" class="parent"><div id="a" class="header">Testing Stuff Here</div><div id="b" class="header">Testing Stuff Here</div><div id="c" class="header">Testing Stuff Here</div></div><script type="text/javascript">///////////////////////////////// Organic.Tree.Menu //// Made by Chocolate570 //// Current Version Details //// [0.1 Beta] ///////////////////////////////////Start Menufunction testThis(e) { var targ; if (!e) var e = window.event; if (e.target) targ = e.target; else if (e.srcElement) targ = e.srcElement; if (targ.nodeType == 3) // defeat Safari bug targ = targ.parentNode; alert(targ.id);}//////////Attribute Setter//////////divHl=document.getElementsByTagName("div");for(i=0;i<divHl.length;i++) { if(divHl[i].className=="parent") { inDiv=divHl[i].getElementsByTagName("div"); for(j=0;j<inDiv.length;j++) { if(inDiv[j].className=="header") { heHl=inDiv[j]; if(heHl.attachEvent) heHl.attachEvent('onclick', testThis); else heHl.setAttribute('onclick', 'testThis()');} } } }////////////////////////////////////</script> Tested in IE, FF O Thank you for your effort, but it seems to me that it doesn't work in FireFox. Wierd. I'll investigate that, but the cross browser code is very helpful. Thanks for pointing that out.And Justin, your fix fixed it all up Thanks. Link to comment Share on other sites More sharing options...
adservio Posted December 1, 2006 Share Posted December 1, 2006 Thanks Justin, dead on with that solution. And I have found that the event passes properly when using your method, give me a second and I will fix my post.Thanks to both, Link to comment Share on other sites More sharing options...
aspnetguy Posted December 1, 2006 Share Posted December 1, 2006 hey I am just glad something I have to say is useful Link to comment Share on other sites More sharing options...
Beta Posted December 1, 2006 Share Posted December 1, 2006 Wouldn't something like this work also? divHl=document.getElementsByTagName("div");for(i=0;i<divHl.length;i++) { if(divHl[i].className=="parent") { inDiv=divHl[i].getElementsByTagName("div"); for(j=0;j<inDiv.length;j++) { if(inDiv[j].className=="header") { inDiv[j].onclick=function() { alert("lol"); } } } }} Also, the whole onclick = function; never works for me=/ Link to comment Share on other sites More sharing options...
aspnetguy Posted December 1, 2006 Share Posted December 1, 2006 yes that would work too Link to comment Share on other sites More sharing options...
Chocolate570 Posted December 1, 2006 Author Share Posted December 1, 2006 Also, the whole onclick = function; never works for me=/Yea, but you can do the whole iframe thing, so it doesn't matter. :)I've almost got the thing working. I'll post it up when I'm done. Link to comment Share on other sites More sharing options...
Chocolate570 Posted December 4, 2006 Author Share Posted December 4, 2006 Guys, I've got it working pretty well so far. I just need a couple more things.1) When the tree menu page is first opened, you have to double click the links to get them to work. Why!?!?2) How do I make it so that the tree menu doesn't close if the even parent is an a element?For #2, I tried using the script you gave me, Adservio, but that requires the event object to be passed to the function. I have no clue how to do that right now, as the javascript onclick= property doesn't accept function(argument) for some reason, even if it's not text. :|Thanks.Code and treemenu can be found here:seekond.com/treemen.html Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now