jquery - 如何通过单击html中另一个页面中的链接使类在另一个页面上处于事件状态

Question

我怀疑我是否可以在 demo1.html 页面中有一个 anchor 标记，如果我单击该链接它必须到达 demo2.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插入。请帮我解决这个问题

Answer 1

首先，像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');