我正在嘗試為網站中的每個 li 標簽添加活動類,但我認為我的代碼有問題,我不知道是什么,任何人都可以提供幫助。我將不勝感激。
$(function () {
var pgurl = window.location.search;
$("li a").each(function () {
if ($(this).attr("href") == pgurl || $(this).attr("href") == '')
$(this).addClass("active");
});
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<ul id="menu" class="bg-blue dker">
<li class="nav-header">???????</li>
<li class="nav-divider"></li>
<li class="">
<a href="#">
<i class="fa fa-tasks"></i>
<span class="link-title">??????? ????????</span>
<span class="fa arrow"></span>
</a>
<ul class="collapse">
<li class="">
<a href="?page=Hot-drinks-section">
????????? ???????</a>
</li>
<li>
<a href="?page=Soft-drinks-section">
????????? ???????</a>
</li>
<li>
<a href="?page=Food-section">
?????????</a>
</li>
</ul>
</li>
<li class="">
<a href="?page=Make-an-order">
<i class="fa fa-plus"></i> <span class="link-title">????? ??? ????</span>
</a>
</li>
</ul>
uj5u.com熱心網友回復:
您需要在父元素示例上添加類: $(this).parent().addClass("active");
試試下面的代碼
$(function () {
var pgurl = window.location.search;
$("li a").each(function () {
if ($(this).attr("href") == pgurl || $(this).attr("href") == '')
$(this).parent().addClass("active");
});
});
uj5u.com熱心網友回復:
試試下面的代碼片段。
我所做的更改是$(this).parent().addClass("active");,將活動類添加到li,而不是a.
$(function () {
var pgurl = window.location.search;
$("li a").each(function () {
if ($(this).attr("href") == pgurl || $(this).attr("href") == '')
$(this).parent().addClass("active");
});
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<ul id="menu" class="bg-blue dker">
<li class="nav-header">???????</li>
<li class="nav-divider"></li>
<li class="">
<a href="#">
<i class="fa fa-tasks"></i>
<span class="link-title">??????? ????????</span>
<span class="fa arrow"></span>
</a>
<ul class="collapse">
<li class="">
<a href="?page=Hot-drinks-section">
????????? ???????</a>
</li>
<li>
<a href="?page=Soft-drinks-section">
????????? ???????</a>
</li>
<li>
<a href="?page=Food-section">
?????????</a>
</li>
</ul>
</li>
<li class="">
<a href="?page=Make-an-order">
<i class="fa fa-plus"></i> <span class="link-title">????? ??? ????</span>
</a>
</li>
</ul>
轉載請註明出處,本文鏈接:https://www.uj5u.com/shujuku/341612.html
標籤:javascript html 查询 css 阿贾克斯
