如何根据位置和 li 元素列表设置 Jquery 变量？答案

【问题标题】：How would I set a Jquery variable based on the location and a list of li elements?如何根据位置和 li 元素列表设置 Jquery 变量？
【发布时间】：2016-06-21 21:53:36
【问题描述】：

我使用的是 JQuery 1.11。我有以下 HTML ...

<div id="tabs">
<ul class="nav">
  <li><a href=“/my_object/index”>My Objects</a></li>
  <li><a href="/my_object/search">Lookup Results</a></li>
    …
  <li><a href="/my_object/edit”>Edit Stuff</a></li>
</ul>
</div>

如果其 href 属性与当前位置匹配，我将如何设置一个变量“activeIndex”作为锚标记的索引？例如，如果当前位置是“https://mydomein.com/my_object/search”，那么 activeIndex 变量就是“1”。

【问题讨论】：

你的js代码呢？

标签： javascript jquery location

【解决方案1】：

你可以使用 window.location.pathname:

function activeIndex() {
    var ul = document.getElementsByClassName("nav");
    var listItems = ul[0].getElementsByTagName("li");
    for (var i = 0; i < listItems.length; i++) {
        var a = listItems[i].getElementsByTagName("a");
        if (a[0].getAttribute("href") === window.location.pathname)
            return i;
    }
    return -1;
}

【讨论】：

【解决方案2】：

您可以使用index 方法来确定一个元素在jquery 元素数组中的索引。

var activeIndex;
$('ul.nav li a').each(function()
{
  if($(this).attr('href') == window.location.pathname)
     activeIndex = $('ul.nav li a').index(this);
});

例如：https://jsfiddle.net/DinoMyte/jmLynLsg/4/

【讨论】：