[英]Add class to anchor-link on other page
I've got a navigation set up with links to anchors on specific page. 我有一个导航设置,其中包含指向特定页面上锚点的链接。
This works when on that specific page, but how can I add the class when coming from another page on my site? 当在该特定页面上时此方法有效,但是当我来自网站上的另一个页面时如何添加类?
<script>
jQuery(function ($) {
$( document ).ready(function() {
$(".sub-menu > li > a").on("click", function(){
$("a.active").removeClass("curlink");
$(this).addClass("curlink");
});
});
});
</script>
There are many ideas/ways to achieve this, but if you have separate file which contains navigation code then you can do one way, you can put in a hidden element with value of id
of the <a>
tag of menu of navigation. 有很多想法/方法可以实现此目的,但是如果您有一个包含导航代码的单独文件,则可以采用一种方法,可以将一个隐藏元素的值
<a>
导航菜单的<a>
标记的id
。 So when you land on the page and found that id value from the hidden field in jquery, you can make that <a>
of navigation activated. 因此,当您登陆页面并从jquery的隐藏字段中找到ID值时,可以激活导航
<a>
。 I mean you can apply active class to that menu. 我的意思是您可以将活动课程应用于该菜单。 Tell me if this is not clear, I would try to make it simple.
告诉我,如果不清楚,我会尽量简化。
In simple words, 简单来说
Add one hidden element in your separate pages like <input type="hidden" value="about_us" id="nav-menu">
And in your master page,put jquery to get this value like: var nav_menu = $('#nav-menu').val();
在单独的页面中添加一个隐藏元素,例如
<input type="hidden" value="about_us" id="nav-menu">
然后在您的母版页中,放入jquery以获取该值,例如: var nav_menu = $('#nav-menu').val();
so in nav_menu
you will have about_us
as its value. 因此在
nav_menu
您将使用about_us
作为其值。
Now, in main master view file, you can write jquery to add active class for relevant manu like: $('.sub-menu > li > a').removeClass('active');$('#'+nav_menu).addClass('active');
现在,在主主视图文件中,您可以编写jquery来为相关
$('.sub-menu > li > a').removeClass('active');$('#'+nav_menu).addClass('active');
添加活动类,例如: $('.sub-menu > li > a').removeClass('active');$('#'+nav_menu).addClass('active');
navigator
navigator
传递一个隐藏的输入元素即可 #a1
then set this hidden element value to "a1"
#a1
的链接时,请将此隐藏元素值设置为"a1"
$("#navigator").val();
$("#navigator").val();
"a1"
in this case, set CSS of link with id a1
whatever you want, using $("#a1").css();
"a1"
在这种情况下,ID链接的设置CSS a1
任何你想要的,使用$("#a1").css();
Another method is that on every hyperlink add a GET parameter and receive on the receiver side and on the basis of its value set CSS. 另一种方法是在每个超链接上添加一个GET参数,并在接收方根据其值集CSS进行接收。
a1,a2,a3
a1,a2,a3
链接 cameFrom
in href
URL eg href=".../*.html?cameFrom=a1"
for link a1
and href=".../*.html?cameFrom=a2"
for link a2
and so on cameFrom
在href
URL如href=".../*.html?cameFrom=a1"
链路a1
和href=".../*.html?cameFrom=a2"
的链接a2
等等 On receiver page get its value by using this function: 在接收者页面上,使用以下函数获取其值:
function param(name){ return (location.search.split(name + '=')[1] || '').split('&')[0]; }
Use param(cameFrom)
and get result. 使用
param(cameFrom)
并获取结果。 Link to this function 链接到此功能
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.