動態更改活動選項卡索引jQuery UI選項卡

我試圖創建一組兩個按鈕，將更改jQuery Ui中的活動選項卡。我想要做的是獲取活動選項卡索引，然後根據按下哪個按鈕轉到下一個選項卡或上一個選項卡。例如，如果活動選項卡是數字3，單擊「moveLeft」會將其更改爲2.如果單擊「moveRight」，它會將其更改爲4.我知道它類似於以下內容，但不是挺：動態更改活動選項卡索引jQuery UI選項卡

var activeTab = $(".tabs").tabs("option", "active"); 

$('#moveLeft').click(function() { 
    $(".tabs").tabs({ activeTab: -1 }); 
}); 
$('#moveRight').click(function() { 
    $(".tabs").tabs({ activeTab: +1 }); 
});

來源

2016-05-31 DeanH

可能的複製（HTTP [點擊選項卡之外的鏈接，多數民衆贊成設置活動選項卡？]：//計算器.com/questions/15641134/set-active-tab-by-clicking-a-link-thats-outside-the-tabs） –

那一個不是動態的。它不會獲得當前的選項卡並添加或減去它，它會根據預定的ID進行設置。 – DeanH

我知道你需要添加prev/next按鈕。我需要一個有步驟的流程。我用jQuery UI的標籤，這爲我工作：

<script type="text/javascript"> 
    $(document).ready(function() { 
     $('#ui-tabs').tabs(); 
     function GetSelTabIndex() { 
      return $('#ui-tabs').tabs('option', 'active'); 
     } 
     function ShowTabs(stepN) { 
      var n = parseInt(stepN); 
      $('#ui-tabs').tabs('option', 'active', parseInt(GetSelTabIndex()) + n); 
     } 

     $('#moveLeft, #moveRight').click(function() { 
      ShowTabs(this.value); 
     }) 
    }); 
</script>

HTML：

<button id="moveLeft" value="-1">Previous tab</button> 
<button id="moveRight" value="1">Next tab</button>

的

來源

2016-08-19 15:21:53

動態更改活動選項卡索引jQuery UI選項卡

回答

相關問題