Question

我正在尝试对我的网站进行排序，这样当我点击一个锚点链接时，它会突出显示标题和它下面的标题。我几乎没有，但我正在努力解决一些问题。

我有一些HTML：

<p id="pp1" class="Subsubhead">Stuff</p>
<p>Nonsense</p>
<p>More</p>
<p id="pp7" class="Subsubhead">Meow</p>
<p>Lorem</p>
<p class="subhead">

我有一些几乎像以下一样的javascript：

function highlight(elemId) {
    var elem = $(elemId);

    elem.nextUntil(".Subsubhead").addClass("snaphighlight");

    //elem.addClass("snaphighlight");
    setTimeout(function () {
        elem.removeClass("snaphighlight")
    }, 1000);
}

$('#navigation a').click(function (event) {
    var elemId = '#' + $(this).attr('href').split('#')[1];
    highlight(elemId);
});

这当前不会突出显示标题，但会突出显示其下方的<p>标记，直到下一个Subsubhead。但是，当下一个p有一个Subhead类时，它会一直突出显示我不想要的那个。有没有办法告诉nextUntil ".subsubhead"&&".subhead"或类似的东西？我的超时也不再有效了。我该如何解决这个问题？

Answer 1

您正在将该类应用于众多元素，但仅将其从一个

中删除

试试这个：

function highlight(elemId) {
    var elem = $(elemId);
    var highlight=elem.nextUntil(".Subsubhead").addClass("snaphighlight");

    //elem.addClass("snaphighlight");
    setTimeout(function () {
        highlight.removeClass("snaphighlight")
    }, 1000);
}

使用##表示jQuery选择器的语法无效，只应使用一个#

jquery nextuntil过滤多个类

1 个答案: