這是我的 HTML，顯示了側(cè)邊欄菜單： <div class="sidebar"> <a class="active" href="<website>/humrec.php">HR Homepage</a> <a href="<website>/hrbenefits.php">Benefits Information</a> <a href="#contact">Scheduling</a> <a href="#about">Links</a> </div>這是我的 jQuery 代碼，但仍然無法工作： $(document).ready(function(){ $(".sidebar a").click(function ( e ) { e.preventDefault(); $(".sidebar a.active").removeClass("active"); //Remove any "active" class $("a", this).addClass("active"); //Add "active" class to selected tab // $(activeTab).show(); //Fade in the active content }); });
1 回答
開滿天機
TA貢獻1786條經(jīng)驗 獲得超13個贊
你的邏輯幾乎是正確的，但問題是$("a", this)。該選擇器正在尋找a中的元素this。問題是this是a剛剛被單擊的，所以您正在尋找a中的a，它與您所擁有的 HTML 結(jié)構(gòu)不匹配。
要解決該問題，您只需使用$(this)引用所a單擊的：
jQuery(function($) {
$(".sidebar a").click(function(e) {
e.preventDefault();
$(".sidebar a.active").removeClass("active");
$(this).addClass("active");
});
});
.active {
color: #C00;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="sidebar">
<a class="active" href="<website>/humrec.php">HR Homepage</a>
<a href="<website>/hrbenefits.php">Benefits Information</a>
<a href="#contact">Scheduling</a>
<a href="#about">Links</a>
</div>
- 1 回答
- 0 關(guān)注
- 92 瀏覽
添加回答
舉報
0/150
提交
取消