Welcome to WebmasterWorld Guest from 54.196.238.210

Forum Moderators: open

Message Too Old, No Replies

Jquery event issue

     

frankstuner

7:20 am on Dec 4, 2011 (gmt 0)



I'm new to jquery and javascript in general, I've been trying to modify one of the examples off the jquery site but have been having trouble adding classes/id's to example and having it work in the same way.

This is the jquery page [api.jquery.com...]

This is the original version:
<ul>
<li>item 1
<ul>
<li>sub item 1-a</li>
<li>sub item 1-b</li>
</ul>
</li>
<li>item 2
<ul>
<li>sub item 2-a</li>
<li>sub item 2-b</li>
</ul>
</li>
</ul>
<script>function handler(event) {
var $target = $(event.target);
if( $target.is("li") ) {
$target.children().toggle();
}
}
$("ul").click(handler).find("ul").hide();</script>


This is what i was trying to do:
<ul id="nav">
<li class="parent-sub">item 1
<ul class="child-nav">
<li class="child-sub">sub item 1-a</li>
<li class="child-sub">sub item 1-b</li>
</ul>
</li>
<li class="parent-sub">item 2
<ul class="child-nav">
<li class="child-sub">sub item 2-a</li>
<li class="child-sub">sub item 2-b</li>
</ul>
</li>
</ul>
<script>
function handler(event)
{
var $target = $(event.target);
if( $target.is("li.child-sub") )
{
$target.children().toggle();
}
}
$("ul#nav").click(handler).find("ul.child-nav").hide();
</script>


When I've tried a few different configs it still breaks the functionality in one way or another.

Can anyone point me in the right direction please?

frankstuner

10:18 am on Dec 4, 2011 (gmt 0)



all good, worked it.
 

Featured Threads

Hot Threads This Week

Hot Threads This Month