-
例如該效果圖
![]()
![]()
-
該部分的html 代碼如下,有部分thymeleaf 標(biāo)簽
<div class="sidebar-collapse">
<ul class="nav" id="main-menu">
<li>
<a class="active-menu" href="index.html"><i class="fa fa-dashboard"></i>HOME</a>
</li>
<li th:each="menu : ${menuList}">
<a href="#"><i class="fa fa-desktop"></i><span th:text="${menu.dispname}"></span></a>
</li>
</ul>
</div>
- 實(shí)現(xiàn)點(diǎn)擊選中的功能,代碼如下
$(".nav >li >a").on("click",function () {
//當(dāng)前元素增加選中樣式
$(this).addClass("active-menu");
//a 的 父級(jí) li 的所有 同級(jí) 下的 子元素 a ,移除樣式
$(this).parent().siblings("li").children("a").removeClass("active-menu");
})
--本文作者:【ngLee 】
--關(guān)于博文:如果有錯(cuò)誤的地方,還請(qǐng)留言指正。如轉(zhuǎn)載請(qǐng)注明出處!如果您覺(jué)得文章對(duì)您有幫助,可以點(diǎn)擊文章右下角【推薦】一下。您的鼓勵(lì)是博主的最大動(dòng)力!


浙公網(wǎng)安備 33010602011771號(hào)