我有一个包含以下li
<div class="menu">
<ul>
<li><a href="index.jsp" class="active">Home</a></li>
<li><a href="listnews.jsp">News</a></li>
<li><a href="abc.jsp">ABC</li>
</ul>
</div>
在此代码中,主页处于活动状态。但是要在我单击“新闻”页面时启用活动状态。我能怎么做?感谢收看。
答案 0 :(得分:2)
请添加Js,例如:
jQuery(document).ready(function () {
jQuery('.menu li a').click(function () {
//removing the previous selected menu state
jQuery('.menu li').find('a.active').removeClass('active');
//adding the state for this parent menu
jQuery(this).addClass('active');
});
});
a.active {
color: red;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="menu">
<ul>
<li><a href="index.jsp" class="active">Home</a></li>
<li><a href="listnews.jsp">News</a></li>
<li><a href="abc.jsp">ABC</li>
</ul>
</div>
答案 1 :(得分:2)
您可以使用jQuery来执行此操作,请使用以下脚本:
p4v -t history -s //path/to/file.txt
答案 2 :(得分:1)
使用一些JS或JQuery,在链接上添加click事件并调用方法
<div class="menu">
<ul>
<li><a href="index.jsp" click="MyMethod">Home</a></li>
<li><a href="listnews.jsp" click="MyMethod">News</a></li>
<li><a href="abc.jsp" click="MyMethod">ABC</li>
</ul>
</div>
并在Jquery(或JS)中: 执行此操作:
YourLinkClicked.removeClass('active');
YourLinkClicked.addClass('active');
或者仅查看以下链接:http://jsfiddle.net/designaroni/E53t9/
答案 3 :(得分:1)
这是使用纯javascript
编写的代码화이팅!!
function change(elem){
var list = document.querySelectorAll(".menu ul li a");
for (var i = 0; i < list.length; ++i) {
list[i].classList.remove('active');
}
elem.classList.add('active');
}
.active{
color:red;
}
<div class="menu">
<ul>
<li><a href="#" class="active" onclick="change(this)">Home</a></li>
<li><a href="#" onclick="change(this)">News</a></li>
<li><a href="#" onclick="change(this)">ABC</a></li>
</ul>
</div>
答案 4 :(得分:-1)
这是我当前的def discount(size, count):
price_8oz = 1.20
price_12oz = 1.75
price_12oz_discount = 1.35
if size == 8:
return price_8oz * count
elif size == 12:
if count <= 4:
return price_12oz * count
elif count > 4:
# divmod() divides one number by another and returns both the number of times
# the second number fits into the first, but also the remainder.
# Here we calculate how many times five goes into the customer order
# and how many extra cups are left over.
fivecount, remainder = divmod(count, 5)
return price_12oz_discount * fivecount * 5 + 1.75 * remainder
# Here we test the code to make sure that it works across several iterations of five counts
# with 12 ounce cups.
for count in range(2, 12):
print('count:', count, 'cost:', discount(12, count))
项目使用的一些基本功能。
将其添加到母版页或共享页中,每次站点重新加载时都需要运行js。
您需要使用jQuery
MVC
$(document).ready(function () {
// the current page url eg /index.jsp
var href = window.location.href.toLowerCase();
$(".menu").find("a").each(function () {
// find the current li that match the current Url
if (href.indexOf($(this).attr("href").toLowerCase()) != -1)
$(this).addClass("active"); // set the current li to active
})
})
.acive{
color:red;
}