4

フリーマーカーページで、4つのタブを作成しています。私が欲しいもの：ユーザーが4番目のタブにいる場合にのみ、送信ボタンが表示されます。彼が1番目、2番目、または3番目のタブにいるとき、彼は次と前のボタンを見ることができます。jqueryまたはjavascriptを使用して、ボタンクリックでアクティブな次または前のタブを作成するにはどうすればよいですか？誰か助けてください...

<div class="tabbable">
    <ul class="nav nav-tabs">
        <li class="active"><a href="#declarations1" data-toggle="tab">Declarations</a></li>
        <li><a href="#hradetails1" data-toggle="tab">HRA Details</a></li>
        <#if IsHidePrevEmpITDeclaration?exists && IsHidePrevEmpITDeclaration != "true">
        <li><a href="#preEmpSalary1" data-toggle="tab">Previous Employment Salary</a></li>
        </#if>
        <li><a href="#otherIncome1" data-toggle="tab">Other Income</a></li>
    </ul>
</div>

前もって感謝します...

4

2 に答える 2

9 
<div class="tabbable columns">
    <ul id="myTab" class="nav nav-tabs">
        <li class="active"><a id="n.1" href="#declarations1" data-toggle="tab"> Declarations </a></li>
        <li class=""><a id="n.2" href="#hradetails1" data-toggle="tab">HRA Details</a></li>
        <li class=""> <a id="n.3" href="#preEmpSalary1" data-toggle="tab">Previous Employment Salary</a></li>
        <li><a id="n.4" href="#otherIncome1" data-toggle="tab">Other Income</a></li>
    </ul>
    <div id="myTabContent" class="tab-content">
        <div class="tab-pane fade active in" id="declarations1">
            <p>The first content</p>
           <input type="button" onclick="document.getElementById('n.2').click()" value="Next" />
        </div>
        <div class="tab-pane fade" id="hradetails1">
            <p>The 2nd content</p>
            <input type="button" onclick="document.getElementById('n.3').click()" value="Next" />
            <input type="button" onclick="document.getElementById('n.1').click()" value="Previous" />
        </div>
        <div class="tab-pane fade" id="preEmpSalary1">
            <p>The 3rd content</p>
            <input type="button" onclick="document.getElementById('n.4').click()" value="Next" />
            <input type="button" onclick="document.getElementById('n.2').click()" value="Previous" />
        </div>
        <div class="tab-pane fade" id="otherIncome1">
            <p>The 4th content</p>
            <input type="submit" value="submit" />
        </div>
    </div>
</div>
于 2012-07-11T10:00:35.523 に答える
5

この Twitter ブートストラップ プラグインは、フォーマッタのタブ可能な構造からウィザードを構築します。ボタンを使用してウィザードのさまざまなステップを実行し、イベントを使用して各ステップに個別にフックすることで、ウィザード機能を構築できます。Githubをチェックしてください。

于 2012-10-14T21:13:13.373 に答える