javascript - 如何使用 Jquery 检查 href 为 ="something"的 div 是否具有特定类

Question

我想检查一个 div 是否带有特定的 href也有一定的类(Class)。我已经编写了这个导航:

<nav>
    <div class="nav-wrapper">
        <ul class="normal-nav hide-on-med-and-down">
            <li><a class="" href="#chi">Chi Siamo</a></li>
            <li><a class="" href="#dirigenza">Dirigenza</a></li>
            <li><a class="" href="#squadre">Squadre</a></li>
            <li><a class="" href="#orariPrezzi">Orari e Prezzi</a></li>
            <li><a class="" href="#modulistica">Modulistica</a></li>
            <li><a class="" href="#contatti">Contattaci</a></li>
            <li><a class="" href="#fotogallery">Fotogallery</a></li>
        </ul>
    </div>
</nav>

A类active被添加到 <a>元素，相对于用户向下滚动的位置，因此 <a>看起来像这样:

<a class="active" href="#dirigenza">Dirigenza</a>

我想连续检查 normal-nav <ul> 中的哪个元素有课active (我有 scrollFire() JQuery 插件):

$('body').scrollfire({
    // Offsets
    offset: 0,
    topOffset: 0,
    bottomOffset: 0,
    onScrollAlways: function(elm, distance_scrolled) {
    },
});

如果 <a> 就做一些事情事件元素是带有 href="#chi" 的元素, href="#dirigenza"等等。

我该怎么做？

Answer 1

您可以使用 $("a.active") 将当前 a 标记为事件。然后您可以使用 $("a.active").attr("href") 获取该事件元素的 href 值，并在 if 或 switch 语句中使用它来管理不同的情况.

var activeHrefValue = $("a.active").attr("href");
if (activeHrefValue == "theValueToBeChecked") {
   doSomething();
}

在您的特定情况下，我认为这是一个很好的解决方案:

$('body').scrollfire({
    // Offsets
    offset: 0,
    topOffset: 0,
    bottomOffset: 0,
    onScrollAlways: function(elm, distance_scrolled) {
        switch($("a.active").attr("href")){
            case "#chi":
                doSomething(elm);
                break;
            case "...":
                doSomethingElse(elm);
                break;
            default: 
                doDefaultSomething(elm);
        }
    },
});

switch 部分可以根据您的需要用一系列 if-else 语句替换。