我需要获取当前所选标签的索引。正如我发现here我需要这样:
$('#tabs').tabs();
curTab2 = $('#tabs .ui-tabs-active');
alert(curTab2);
然而,结果我得到[object Object]
而不是数字(因为我不知道我需要使用什么属性)。我在代码中添加什么来获取活动标签的索引?
$( function() {
$( "#tabs" ).tabs();
$( "#tabs2" ).tabs();
$( "#click" ).click(function() {
var $tabs = $('#tabs2').tabs();
var selected = $tabs.tabs('option', 'active');
alert(selected);
});
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<div id="tabs">
<ul>
<li><a href="#tabs-1"><div>this 1</div></a></li>
<li><a href="#tabs-2"><div>this 2</div></a></li>
</ul>
<div id="tabs-1">this 1 content</div>
<div id="tabs-2">this 2 content</div>
</div>
<div id="tabs2">
<ul>
<li><a href="#tabs2-1"><div>this 1</div></a></li>
<li><a href="#tabs2-2"><div>this 2</div></a></li>
</ul>
<div id="tabs2-1">this 1 content</div>
<div id="tabs2-2">this 2 content</div>
</div>
<div id="click">Push</div>
&#13;
答案 0 :(得分:1)
请勿为此目的检查课程。使用内置于metod的{ui <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="container-1">
<h5>
header
<a href="#" class="edit_toggle">edit</a>
</h5>
<div class="not-editable">
Lorem
</div>
<div class="editable">
Lorem 123
</div>
</div>
<div class="container-1">
<h5>
another header
<a href="#" class="edit_toggle">edit</a>
</h5>
<div class="row not-editable">
another Lorem
</div>
<div class="row editable">
another Lorem 123
</div>
</div>
ui.newTab.index()
&#13;
$('#tabs').tabs();
$("#tabs").bind("tabsactivate", function (event, ui) {
alert('Index= ' + ui.newTab.index());
});
&#13;