如何获取下一步按钮以转到页面上的下一个锚点w jQuery

我用jQuery设置了一个subnav窗格，以（1）突出显示导航链接（2）显示相关内容

现在，我正努力让“下一步”按钮工作，自动将我带到下一个主题

我（显然）是JQUERY的新手。如果有任何提示，我将不胜感激。或者关于如何改进subnav的现有代码的建议。

请尝试：

$(document).on('click', '#next', function () {

    var highlighted = $("#steps-subnav li").filter(".highlighted"),
        next = (highlighted.length > 0) ? highlighted.next() : $("#steps-subnav li:first");

    next.trigger("click");
    next.find("a").trigger("click");

});

小提琴

试试这个：

 $(document).on('click', '.red-button', function () {
        var $current = $('#steps-subnav li.highlighted');
        $('#steps-subnav .highlighted').removeClass('highlighted');

        var $next = $current.is(':last-child')? $('#steps-subnav li:first').next(): $current.next();
        $next.addClass('highlighted');
        $next.children('a').trigger("click");
    });

---

@丽萃太棒了！如果没有其他问题，请关闭此问题。将关闭。抱歉，我对这个很陌生。。。如果这不是一个巨大的痛苦，你介意解释一下var next=行吗？这很有效，但我很想知道这一行到底发生了什么。谢谢我声明了两个变量-

突出显示的

和

下一个

<代码>突出显示的被分配到当前具有突出显示的类的

li

。变量

next

被分配

li

，该变量位于

突出显示的
变量中元素的旁边，这使用一个条件来检查
突出显示的
类中是否有
li
，如果有任何这样的元素，则分配下一个元素，如果没有，分配列表中的第一个
li
@丽珠
 $(document).on('click', '.red-button', function () {
        var $current = $('#steps-subnav li.highlighted');
        $('#steps-subnav .highlighted').removeClass('highlighted');

        var $next = $current.is(':last-child')? $('#steps-subnav li:first').next(): $current.next();
        $next.addClass('highlighted');
        $next.children('a').trigger("click");
    });