鏈?zhǔn)讲僮饕话銘?yīng)用于導(dǎo)航欄,網(wǎng)頁右側(cè)的那一行導(dǎo)航郑临,他運(yùn)用了選擇器里面的parent>child
栖博,然后運(yùn)用函數(shù)siblings()
。
給第一級 dom 加載點(diǎn)擊事件厢洞,然后給點(diǎn)擊的 dom 加載一個(gè)類仇让,讓其緊鄰其后的子類dom 通過 show()
顯示,其他和他處于同一級的 dom 下面的子類 dom 通過 hide()
隱藏躺翻。當(dāng)然在這個(gè)過程中要加入 'siblings()' ,避免出現(xiàn)錯(cuò)誤和沖突丧叽。
<li class="level1">
<a href="#none">襯衫</a>
<ul class="level2">
<li><a href="#none">短袖襯衫</a></li>
<li><a href="#none">長袖襯衫</a></li>
<li><a href="#none">短袖T恤</a></li>
<li><a href="#none">長袖T恤</a></li>
</ul>
</li>
<li class="level1">
<a href="#none">衛(wèi)衣</a>
<ul class="level2">
<li><a href="#none">開襟衛(wèi)衣</a></li>
<li><a href="#none">套頭衛(wèi)衣</a></li>
<li><a href="#none">運(yùn)動(dòng)衛(wèi)衣</a></li>
<li><a href="#none">童裝衛(wèi)衣</a></li>
</ul>
</li>
<li class="level1">
<a href="#none">褲子</a>
<ul class="level2">
<li><a href="#none">短褲</a></li>
<li><a href="#none">休閑褲</a></li>
<li><a href="#none">牛仔褲</a></li>
<li><a href="#none">免燙卡其褲</a></li>
</ul>
</li>
$(function(){
$(".level1 > a").click(function(){
$(this).addClass("current")
.next().show()
.parent().siblings().children("a").removeClass("crrent")
.next().hide();
return false;
});
記得在寫作的過程中要加入`$(function(){ });'參考'http://www.reibang.com/writer#/notebooks/1426273/notes/1678741'