Question

我有一个js函数的html。并使用jquery ui -tabs。

<ul>
 <li><a href="#tabs-1">MenueTree</a></li>
 <li id="liConfigCustomer"><a href="#tabs-2">ConfigCustomer</a></li>

</ul>
 <div id="tabs-1"><input type='button' value='test' id ='betTest'></div>
 <div id="tabs-2"><input type='button' value='test' id ='betTest2'></div>

有一个js func，当我点击按钮'betTest'做某事并自动转向制表符-2，怎么写这个函数？

Answer 1

您可以为点击按钮编写点击处理程序，您可以使用active option setter

更改标签元素的有效标签

$('#betTest').click(function(){
    $( "#tabs" ).tabs( "option", "active", 1 );
})

演示：Fiddle

Answer 2

如果不对选项卡索引进行硬编码，请执行此操作

<div id="tabs">
  <ul>
    <li><a href="#tabs-1">Tab1</a></li>
    <li><a href="#tabs-2">Tab2</a></li>
    <li><a href="#tabs-3">Tab3</a></li>
  </ul>
  <div id="tabs-1">
      <input type='button' value='test' id ='betTest' />
  </div>
  <div id="tabs-2">
      <input type='button' value='test22' id ='betTest2' />
  </div>
  <div id="tabs-3">

  </div>
</div>

然后在你的JS上

$(function() {
    $("#tabs").tabs();
    $("#betTest").click(function()
           {
             var tabToSelect = $('#tabs-2');
             tabIndexToSelect = tabToSelect.index() -1;
             $("#tabs").tabs({ active: tabIndexToSelect });
           }
        );
});

Fiddler在这里

http://jsfiddle.net/rsmacaalay/CB2wJ/

如何通过代码更改jquery ui选项卡？

2 个答案: