jQuery UI选项卡 - 在视图

Question

我需要获取当前所选标签的索引。正如我发现here我需要这样：

$('#tabs').tabs();
curTab2 = $('#tabs .ui-tabs-active');
alert(curTab2);

然而，结果我得到[object Object]而不是数字（因为我不知道我需要使用什么属性）。我在代码中添加什么来获取活动标签的索引？

＆＃13;

＆＃13;

$( function() {
  $( "#tabs" ).tabs();
  $( "#tabs2" ).tabs();

  $( "#click" ).click(function() {
  var $tabs = $('#tabs2').tabs();
  var selected = $tabs.tabs('option', 'active');
  alert(selected);
  });
});

＆＃13;

<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;

＆＃13;

＆＃13;

Answer 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>

＆＃13;

＆＃13;

ui.newTab.index()

＆＃13;

$('#tabs').tabs();
$("#tabs").bind("tabsactivate", function (event, ui) {
      alert('Index= ' + ui.newTab.index());
});

＆＃13;

＆＃13;

＆＃13;