javascript - 選擇一個(gè)標(biāo)簽,給選中的標(biāo)簽添加類樣式,給同輩元素刪除類樣式
問題描述
單擊一個(gè)標(biāo)簽,給他添加類樣式,同時(shí)刪除同輩元素類樣式。
//單擊事件,$('.user-menu li a').click(function(){
//單擊時(shí),給他添加樣式,同時(shí)遍歷同輩元素刪除該樣式//但是實(shí)現(xiàn)不了,是不是我的思路錯(cuò)了$(this).addClass('active').siblings().removeClass('active');
});
//標(biāo)簽,li標(biāo)簽里面有個(gè)a標(biāo)簽,初始只有收藏車輛有樣式,,不知道為什么顯示不出來<ul class='user-menu'><li>收藏車輛</li><li>降價(jià)提醒</li><li>瀏覽記錄</li></ul>
未點(diǎn)擊時(shí)
點(diǎn)擊后 是想點(diǎn)擊的標(biāo)簽添加演示,把原來標(biāo)簽的樣式刪除,只留一個(gè)樣式
點(diǎn)擊后 想實(shí)現(xiàn)的樣子 未實(shí)現(xiàn)
問題解答
回答1:$('.user-menu li a').click(function(){
//先全部干掉$('.user-menu li a').removeClass('active'); //再給this加上$(this).addClass('active');
});我一般是這么用的,同求更好方案;補(bǔ)充:你的選擇器選到的是li標(biāo)簽內(nèi)部的a標(biāo)簽,然后找a標(biāo)簽的同輩元素,是找不到其他li標(biāo)簽下的a標(biāo)簽的。
回答2:先遍歷所有元素,然后給當(dāng)前的加樣式,其他的移除這個(gè)樣式
回答3:我的方案:
$(’.user-menu li a’).on(’click.app’, function(){ // 自身加屬性 - 同輩移屬性 $(this).addClass(’active’).parent() // 退回到父級(jí) li.siblings().removeClass(’active’);});
