Использования JQuery event.target для работы с детьми

Question

Моим вопроса относится конкретно к http://api.jquery.com/event.target/#example-1

Если вы используете интервал в <li> или другом теге, чтобы изменить стиль, такие как <b> как я сделал here, что часть из элемент не будет запускать функцию JQuery для переключения своих детей. Как можно заниматься этой работой?

HTML:

<ul> 
    <li><b>This doesn't work,</b> this does 
    <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> 

JavaScript:

function handler(event) { 
    var $target = $(event.target); 
    if($target.is("li")) { 
    $target.children("ul").toggle(); 
    } 
} 
$("ul").click(handler).find("ul").hide(); 

Answer 1

Чтобы продолжать использовать текущую форму, я предлагаю использовать closest():

function handler(event) { 
    $(event.target).closest('li').children("ul").toggle(); 
} 
$("ul").click(handler).find("ul").hide(); 

JS Fiddle demo.

Хотя для собственного использования, я предпочел бы:

$('li').on('click', function(e){ 
    e.stopPropagation(); 
    $(this).find('ul').toggle(); 
}); 

JS Fiddle demo.

Ссылки:

• closest().
• on().