提问者:小点点

基于URL的活动链接


有谁能帮我..我想根据我的URL在我的菜单上添加一个活动类

这是密码

<div class="taglist">
<a class="automotive" title="Automotive Tag" href="#">Automotive</a>
<a class="banca" title="Banca Tag" href="#">Banca</a>
<a class="banking-pt" title="Banking Tag" href="#">Banking</a>
<a class="big-data" title="Big Data Tag" href="#">Big Data</a>
<a class="bigdata" title="BigData Tag" href="#">BigData</a>
<a class="cloud" title="Cloud Tag" href="#">Cloud</a>
</div>

可能的URL

http://www.whatever.com/?tag=automotive,big-data,cloud
http://www.whatever.com/?tag=automotive,big-data
http://www.whatever.com/tag/automotive

所以,我需要的是当URL是http://www.whatever.com/?tag=automotive,big-data时,我想再添加一个类,比如active。

示例:

URL: http://www.whatever.com/?tag=automotive,big-data

HTML:

<div class="taglist">
<a class="automotive active" title="Automotive Tag" href="#">Automotive</a>
<a class="banca" title="Banca Tag" href="#">Banca</a>
<a class="banking-pt" title="Banking Tag" href="#">Banking</a>
<a class="big-data active" title="Big Data Tag" href="#">Big Data</a>
<a class="bigdata" title="BigData Tag" href="#">BigData</a>
<a class="cloud" title="Cloud Tag" href="#">Cloud</a>
</div>

共1个答案

匿名用户

这种代码风格适合您

// var url=document.URL;
var url="http://www.whatever.com/tag/automotive/";

// remove latest /
if (url[url.length-1] == "/")
{url = url.substring(0, url.length-1);}
alert(url);

// when "tag/"
if(url.indexOf("tag/") != -1){
    url = url.split('tag/')[1];
}
// when "tag="
else
{
    url = url.split('tag=')[1];
}
// split in table
var tagArray = url.split(',');
// foreach table item put active on menu links
for (var i = 0; i < tagArray.length; i++) {
        $( "."+tagArray[i] ).addClass( "active" );    
}

您可以在这里看到工作代码:http://jsfidle.net/mh7ory9n/8/