Question

http://jsfiddle.net/lizyo/geYka/18/

   $(document).ready(function () {
      $('.steps-content').css('display', 'none');
      $('#step_00').css('display', 'block');
   });

   $(document).on('click', '#steps-subnav li', function () {
      $('#steps-subnav li').removeClass('highlighted');
      $(this).addClass('highlighted');
   });

   $(document).on('click', '#steps-subnav a', function () {
      var linknum = $(this).attr('class').split('_')[1];
      $('#step_' + linknum).css('display', 'block');
      $('.steps-content').not("#step_" + linknum).css('display', 'none');
   });

我已经使用jQuery设置了一个subnav窗格，以便（1）突出显示navlink（2）显示相关内容。

现在，我正努力让NEXT按钮自动转到下一个主题。

我（很明显！）是JQUERY的新手。非常感谢任何提示。或者有关如何改进现有代码的建议。

Answer 1

尝试：

$(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");

});

小提琴here

Answer 2

试试这个：

 $(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");
    });

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

2 个答案: