如何通过点击html中另一个页面中的链接,使一个类在另一个页面上处于活动状态

时间:2015-05-29 09:13:30

标签: jquery html css

我有一个疑问,如果我点击它必须到demo2.html页面的链接,我可以在demo1.html页面中有一个锚标记。在demo2.html页面中,我正在使用数据过滤器,它必须选择我们可以这样做的过滤器。 以下是我正在使用的示例代码

Demo1.html

<a href="careers.html">Bangalore </a> | <a href="#"> Mumbai </a>

Demo2.html

<ul>
    <li class="filter"><a class="selected" href="#0" data-type="all">All</a></li>
    <li class="filter" data-filter=".bangalore"><a href="#0" data-type="bangalore">Bangalore</a></li>
    <li class="filter" data-filter=".mumbai"><a href="#0" data-type="mumbai">Mumbai</a></li>
</ul>
<ul>
    <li class="mix bangalore"></li>
    <li class="mix mumbai"></li>
</ul>

我正在使用此filter插件。请帮助我解决这个问题

1 个答案:

答案 0 :(得分:0)

首先,创建一个函数来获取How can I get query string values in JavaScript?

中的查询字符串参数
function getParameterByName(name) {
    name = name.replace(/[\[]/, "\\[").replace(/[\]]/, "\\]");
    var regex = new RegExp("[\\?&]" + name + "=([^&#]*)"),
        results = regex.exec(location.search);
    return results === null ? "" : decodeURIComponent(results[1].replace(/\+/g, " "));
}

然后将您的链接更新为

<a href="careers.html?dataType=bangalore">Bangalore </a> | <a href="#"> Mumbai </a>

最后,在新页面中定位元素

$('li.filter').filter(function(){
    return $(this).attr('data-type') == getParameterByName('dataType');
}).addClass('active');