Question

这是我的标记：

<ul class="tab1">
<li><a href="http://site.com/some.html?param=1"></li>
<li><a href="http://site.com/some.html?param=2"></li>
<li><a href="http://site.com/some.html?param=3"></li>
...
</ul>

我正在尝试比较当前window.location是否匹配任何列表锚点，如果为true，那么我想做类似addClass（'active'）的事情。

我的代码用于检查浏览器的当前位置并从列表元素中获取href参数：

// get current url parameter
var getBrowserUrl = document.URL.split('?')[1];

// get parameters of all the <li> anchors
jQuery('.tab1 a').each(function(){
    var getElementUrl = jQuery(this).attr('href').split('?')[1];
    if (getBrowserUrl == getElementUrl ) {
        jQuery(this).addClass('active');
    }
});

jQuery（this）位显然不起作用，因为'this'将引用所有列表元素。

如何指定匹配列表元素？

Answer 1

我已经测试了您的代码并进行了一些修改，请尝试以下方法：

 <ul class="tab1">
     <li><a href="http://site.com/some.html?param=1"/></li>
     <li><a href="http://site.com/some.html?param=2"/></li>
     <li><a href="http://site.com/some.html?param=3" /></li>
</ul>
    <script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.7.1.min.js"></script>
     <script type="text/javascript">
         $(function () {
             // get current url parameter
             var getBrowserUrl = document.URL.split('?')[1];
             // get parameters of all the <li> anchors
             $('.tab1 a').each(function () {
                 var getElementUrl = $(this).attr('href').split('?')[1];
                 if (getBrowserUrl == getElementUrl) {
                     $(this).addClass('active');
                 }
             });
         });
     </script>

Answer 2

如果您希望更好地控制正在迭代的项目，请将其添加到.each函数中：

.each(function(index, value) { ... }

这样，值就是你想要找到的元素。

在jQuery的.each函数中查找特定元素并使用它执行某些操作

2 个答案: