Jquery UI选项卡：基于选择框的下一个和上一个启用/禁用

我目前正在使用Jquery UI选项卡，我只使用下一个/上一个按钮（这将强制用户按顺序浏览选项卡）。 在我的第一个选项卡中，我有一组动态选择框，我试图让用户在给出启用NEXT按钮的可能性之前从中选择一个类别及其子类别。 但是下一个按钮根本没有被禁用。

如何让用户从所有相应的选择框中进行选择，然后启用NEXT按钮？ 例

我添加了$('.update').change(function()更改为JS的NEXT / PREVIOUS以检测最后一个选择框中的所选项目，然后选择NEXT按钮

JS for NEXT / Previous

  $(function() { var $tabs = $('#tabs').tabs({ disabled: [0, 1] }); $(".ui-tabs-panel").each(function(i) { var totalSize = $(".ui-tabs-panel").size() - 1; if (i != totalSize) { next = i + 2; $(this).append("Next Page »"); } if (i != 0) { prev = i; $(this).append("« Prev Page"); } }); $('.update').change(function() { $('#tabs').tabs( 'option', 'disabled', ( $(this).hasClass('last') && parseInt($(this).val(), 10) > 0 ? [] : [1] ) ); }); $('.next-tab, .prev-tab').click(function() { var tabIndex = $(this).attr("rel"); $tabs.tabs('enable', tabIndex) .tabs('select', tabIndex) .tabs("option","disabled", [0, 1]); return false; }); });  

upadateSelectBox.js

 // following line is added to detect last select box picked $('.update').removeClass('last'); if (!data.error) { obj.next('.update').html(data.list).removeAttr('disabled hidden'); } else { // following line is changed obj.addClass('last').nextAll('.update').attr({'disabled': true, 'hidden':true}).html('----'); } 

选择框的HTML

  Select one   <option value="">       ----   ----  

Answer 1

好的，这是未经测试的。 仅更改下一次/上一次单击时的选项卡，如果您不在第一个选项卡（1）上或存在真正的最后一个选项卡，则选择一个选项（中性除外） （2） 。

 $('.next-tab, .prev-tab').click(function() { var tabIndex = $(this).attr("rel"); if ( /*(1)*/ $('#tabs').tabs('option', 'selected') > 0 || /*(2)*/ ($('.update.last').length > 0 && parseInt($('.update.last').val(), 10) > 0) ) { $tabs.tabs('enable', tabIndex) .tabs('select', tabIndex) .tabs("option","disabled", [0, 1]); } return false; }); 

祝你好运明天见到你:-)