如何獲得下一步按鈕進入到下一個錨頁面在w上的jQuery

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）顯示相關內容。

現在，我努力讓下一步按鈕工作，自動帶我到下一個主題。

我是（很明顯！）JQUERY的新手。將不勝感激任何提示。或者關於如何改進我現有的subnav代碼的建議。

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