-1

我正在使用下面的代码,因此我可以单击选项卡内容内的链接并在同一页面上打开另一个选项卡(不跳转页面)。我为那些我想“跳转”到另一个选项卡内的锚点的链接添加了一个特殊的类(“跳转”)。

这对我有用,但必须有一种更有效的方式来写这个:

var $tabs = $("#tabs").tabs();
$('.ui-tabs-panel a.tab1').click(function(e) {e.preventDefault(); $tabs.tabs( "option", "active", 0 );});
$('.ui-tabs-panel a.tab2').click(function(e) {e.preventDefault(); $tabs.tabs( "option", "active", 1 );});
$('.ui-tabs-panel a.tab3').click(function(e) {e.preventDefault(); $tabs.tabs( "option", "active", 2 );});
$('.ui-tabs-panel a.tab4').click(function(e) {e.preventDefault(); $tabs.tabs( "option", "active", 3 );});
$('.ui-tabs-panel a.tab5').click(function(e) {e.preventDefault(); $tabs.tabs( "option", "active", 4 );});
$('.ui-tabs-panel a.tab6').click(function(e) {e.preventDefault(); $tabs.tabs( "option", "active", 5 );});
$('.ui-tabs-panel a.tab7').click(function(e) {e.preventDefault(); $tabs.tabs( "option", "active", 6 );});
$('.ui-tabs-panel a.tab8').click(function(e) {e.preventDefault(); $tabs.tabs( "option", "active", 7 );});
$('.ui-tabs-panel a.tab9').click(function(e) {e.preventDefault(); $tabs.tabs( "option", "active", 8 );});

$('.ui-tabs-panel a.tab1jump').click(function(e) {$tabs.tabs( "option", "active", 0 );});
$('.ui-tabs-panel a.tab2jump').click(function(e) {$tabs.tabs( "option", "active", 1 );});
$('.ui-tabs-panel a.tab3jump').click(function(e) {$tabs.tabs( "option", "active", 2 );});
$('.ui-tabs-panel a.tab4jump').click(function(e) {$tabs.tabs( "option", "active", 3 );});
$('.ui-tabs-panel a.tab5jump').click(function(e) {$tabs.tabs( "option", "active", 4 );});
$('.ui-tabs-panel a.tab6jump').click(function(e) {$tabs.tabs( "option", "active", 5 );});
$('.ui-tabs-panel a.tab7jump').click(function(e) {$tabs.tabs( "option", "active", 6 );});
$('.ui-tabs-panel a.tab8jump').click(function(e) {$tabs.tabs( "option", "active", 7 );});
$('.ui-tabs-panel a.tab9jump').click(function(e) {$tabs.tabs( "option", "active", 8 );});

我可以在不为每个选项卡写一行的情况下做到这一点吗(两次!)?

4

1 回答 1

1

你可以遍历并修改选择器

var i = 1;
while (i<10)
  {
    $(".ui-tabs-panel a.tab" + i).click(function(e) {e.preventDefault(); $tabs.tabs( "option", "active", (i-1_ );});
    $('.ui-tabs-panel a.tab' + i + 'jump').click(function(e) {$tabs.tabs( "option", "active", (i-1) );});
    i++;
  }
于 2013-07-10T17:12:03.367 回答