我正在建立一个“退房”像交互与jQuery UI选项卡。这意味着单击第一个选项卡上的按钮将停用第一个选项卡并移动到下一个选项卡。我一直在梳理通过Stack Overflow的帖子，但没有我尝试似乎工作。我使用jQuery UI 1.8，这里是代码：
- <script type="text/javascript">
- $(document).ready(function() {
- var $tabs = $('#tabs').tabs({ selected: 0 });
- $tabs.tabs('option','selected',0);
- $("#tabs").tabs({disabled: [1,2]});
- $("#addstudent").click(function(){
- $tabs.tabs('option',1);
- $("#tabs").tabs({disabled: [0,2]});
- });
- $("#confirm").click(function(){
- $tabs.tabs('option',2);
- $("#tabs").tabs({disabled: [0,1]});
- });
- });
- </script>
- <div id="tabs">
- <ul>
- <li><a href="#fragment-1">Student Information</a></li>
- <li><a href="#fragment-2">Confirmation</a></li>
- <li><a href="#fragment-3">Invoice</a></li>
- </ul>
- <div id="fragment-1">
- <button id="addstudent" >Add Student</button>
- </div>
- <div id="fragment-2">
- <button id="confirm" >Confirm</button>
- </div>
- <div id="fragment-3">
- tab 3,index 2
- </div>
- </div>
当我单击按钮时，下一个选项卡变为未锁定(可选择)，但不会禁用索引0处的选项卡，并切换到索引1处的选项卡。此外，相应的面板不会显示。有人可以提供一些建议吗？
解决方法
尝试将代码更改为：
- var $tabs = $('#tabs').tabs({ selected: 0,disabled: [1,2] });
- $("#addstudent").click(function(){
- $tabs.tabs('enable',1).tabs('select',1).tabs('disable',0);
- });
- $("#confirm").click(function(){
- $tabs.tabs('enable',2).tabs('select',2).tabs('disable',1);
- });
