Welcome to WebmasterWorld Guest from 54.146.201.80

Forum Moderators: open

Message Too Old, No Replies

Jquery event issue

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

New User

joined:Oct 12, 2011
posts: 25
votes: 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?
10:18 am on Dec 4, 2011 (gmt 0)

New User

joined:Oct 12, 2011
posts: 25
votes: 0


all good, worked it.
 

Join The Conversation

Moderators and Top Contributors

Hot Threads This Week

Featured Threads

Free SEO Tools

Hire Expert Members