[英]jQuery toggle children list-items
我想通過單擊父列表項來切換單個子項的可見性。
我有這樣的filetree:
<div id="browser">
<ul><li class='folder'>Musik
<ul><li class='folder'>Alben
<ul><li class='folder'>100JahreEAV
<ul>
<li class='file'>000_erste_allgemeine_verunsicherung_-_100_jahre_eav-backcover.jpg</li>
<li class='file'>000_erste_allgemeine_verunsicherung_-_100_jahre_eav-frontcover.jpg</li>
<li class='file'>101_alles_gute_eav.mp3</li><li class='file'>102_popstar.mp3</li>
<li class='file'>103_samurai.mp3</li><li class='file'>104_kuess_die_hand_schoene_frau.mp3</li>
<li class='file'>105_coconut_island.mp3</li><li class='file'>106_johnny_i_fahrscheine.mp3</li>
</ul>
</li></ul>
</li></ul>
</li></ul>
</div>
到目前為止這是我的代碼:
$("div#browser ul li ul").hide();
$("li").click(function() {
if($(this).hasClass('active')) {
$(this).removeClass('active').children().hide();
} else {
$(this).addClass('active').children().show();
}
});
問題是如果我點擊任何地方,所有父列表項都會受到影響。 你能告訴我如何一次切換一個項目嗎?
演示 - 添加e.stopPropagation();
防止事件傳播到嵌套元素。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.