我正在尝试创建一个简单的next and back按钮，通过data attr显示bootstrap 3中的标签
这是工作小提琴 http://jsfiddle.net/52VtD/9162/
这是 HTML
<div class="tab-content">
<div class="tab-pane active" id="1" data-step="1">1</div>
<div class="tab-pane" id="2" data-step="2">2</div>
<div class="tab-pane" id="3" data-step="3">3</div>
<div class="tab-pane" id="4" data-step="3">4</div>
</div>
<a href="#1" data-toggle="tab" class="step-back">back</a>
<a href="#2" data-toggle="tab" class="step-next">next </a>
但是在最后一个标签上我必须显示Finish而不是下一个，这是某种向导，我已经尝试过引导向导，但我在3.3中不起作用：（
答案 0 :(得分：1)
http://jsfiddle.net/52VtD/9197/
<强> HTML：
<div class="tab-content">
<div class="tab-pane active" id="1" data-step="1">1</div>
<div class="tab-pane" id="2" data-step="2">2</div>
<div class="tab-pane" id="3" data-step="3">3</div>
<div class="tab-pane" id="4" data-step="4">4</div>
</div>
<a href="#1" data-toggle="tab" class="step-back">back</a>
<a href="#2" data-toggle="tab" class="step-next">next </a>
<强> JQ：
$('.step-back, .step-next').on('shown.bs.tab', function (e) {
currentStep()
})
function currentStep() {
var currentVal = $('.tab-pane.active').attr("data-step");
currentVal = parseInt(currentVal)
var prev = currentVal - 1;
var next = currentVal + 1;
$('.step-back').attr('href','#' + prev);
$('.step-next').attr('href','#' + next);
}