[英]add class on li remove after page load
I am using jquery to add the class to active css on "li" and also navigate to an html page.but after page navigates the class disappers on "li". 我正在使用jquery将类添加到“ li”上的活动CSS上,并且还导航到html page。但是在页面上导航“ li”上的类分配器之后。 I have tried different ways to resolve this but couldn't get the point. 我尝试了不同的方法来解决此问题,但无法理解。
$(document).ready(function(){
$( '#topList ul li' ).click(function() {
alert($(this).attr('id'));
if($(this).attr('id') == "add") {
document.location.href = 'localhost:8080/add';
$(this).attr('id').addClass("active");
}
});
});
here is the menu list, what I want is when I click on li it should call a page add and also add a class on that li. 这是菜单列表,我想要的是当我单击li时它应该调用页面添加,并在该li上添加一个类。
html code HTML代码
<ul class="nav">
<li class="" id="add"><a href="javascript:void(0);" ><i class="add"></i> Add</a> </li>
<ul>
You need to add class for the li in the page you are calling ie, the page will be rendered when you call localhost:8080/add . 您需要在正在调用的页面中为li添加类,即,当您调用localhost:8080 / add时将呈现该页面。 Because in your code setting up of active class wont be called since the localhost:8080/add will start loading in the previous line of code (document.location.href = 'localhost:8080/add';)
因为在您的代码中将不会调用活动类的设置,因为localhost:8080 / add将开始在上一行代码中加载(document.location.href = 'localhost:8080/add';)
If the page to be rendered is static page then, add this code in that page. 如果要呈现的页面是静态页面,则在该页面中添加此代码。
$(document).ready(function(){
$('#add').addClass("active");
});
I solved this problem on my website by looking at the URL and deciding which of the navigation elements was best to add. 我解决了这个问题, 我的网站上通过查看URL,并决定该导航元素是最好的补充。
function showContent(target) {
var e = $('#'+target);
$(".content").hide();
$("#nav li.active").removeClass("active");
$("#nav li[target='"+target+"']").addClass("active");
e.toggle();
ga('send','pageview',window.location.pathname+"#"+target);
}
// this looks at the URL (by the #...) and decides which view is active
// this gets called on ready and if the client hits the link
// (which dynamically loads instead of making a trip for a new page to the server)
$(window).hashchange(function() {
var which=window.location.hash.substring(1);
switch( which) {
default:
which="profile";
case "profile":
case "resume":
case "projects":
case "contact":
showContent( which);
}
});
Use the following script on the page where you have menu or the links. 在具有菜单或链接的页面上使用以下脚本。
<div id="cssmenu">
<a href="blah blah" > Test page</a>
<a href="blah blah" > Test page</a>
</div>
$(document).ready(function () {
var pageTitle = window.location.pathname.replace(/^.*\/([^/]*)/, "$1");
$('#cssmenu a').each(function () {
if ($(this).attr('href').toLowerCase() == pageTitle.toLocaleLowerCase())
$(this).addClass('active');
});
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.