週期jQuery UI的選項卡上的「上一頁」和「下一步」按鈕

我使用jQuery UI選項卡爲我的網站。週期jQuery UI的選項卡上的「上一頁」和「下一步」按鈕

<script type='text/javascript'> 
//<![CDATA[ 
jQuery(window).load(function(){ 
jQuery('#myTabs').tabs({ fx: { opacity: 'toggle' }}); 

jQuery('.next-product').click(function(){ 
var jQuerytabs = jQuery('#myTabs').tabs(); 
var selected = jQuerytabs.tabs('option', 'selected'); 
jQuerytabs.tabs('select', selected+1); 
}); 

jQuery('.previous-product').click(function(){ 
var jQuerytabs = jQuery('#myTabs').tabs(); 
var selected = jQuerytabs.tabs('option', 'selected'); 
jQuerytabs.tabs('select', selected-1); 
});

正如你所看到的，我一直在使用上一個按鈕從一個標籤移動到另一個標籤。我的問題是「當我第二次點擊，如果最後一個選項卡是開放的，然後自動將第一個標籤應該拿開，同樣當我點擊以前，如果第一個選項卡是開放的，然後自動將最後一個標籤應拿開「

請幫我，我從現在開始3天后無解卡。我在網上搜索了很多，但沒有解決這個問題。

來源

2012-02-01 Django Anonymous

你可以指望.ui-tabs-panel元素的數量。

jQuery(window).load(function() { 

    var $tabs = jQuery('#myTabs'); 

    $tabs.tabs({ 
     fx: { 
      opacity: 'toggle' 
     } 
    }); 

    var amount = $tabs.find('.ui-tabs-panel').length; 

    jQuery('.next-product').click(function() { 
     var selected = $tabs.tabs('option', 'selected'); 
     $tabs.tabs('select', selected + 1 === amount ? 0 : selected + 1); 
    }); 

    jQuery('.previous-product').click(function() { 
     var selected = $tabs.tabs('option', 'selected'); 
     $tabs.tabs('select', selected === 0 ? amount - 1 : selected - 1); 
    }); 

});

DEMO

注：

已經選擇標籤元素，並重新使用選擇var $tabs = jQuery('#myTabs');，這將是更有效的
沒有必要再調用.tabs()您單擊處理

來源

2012-02-01 06:35:54

感謝您的快速回復的人，你真的解決了我的問題...這很好。你真的很棒。 – 2012-02-01 07:02:46

很高興幫助！ – 2012-02-01 07:13:43

你好迪迪爾，感謝您的幫助，我再次卡在一個地方。我需要更改選項卡的fx效果，以便可以按照圖像滑塊用於滑動的方式將其滑動。從右至左的鏈接 - 一個正在向後移動。或者你可以看看這個例子： - http://jqueryfordesigners.com/demo/coda-slider.html 以下內容移動採取與它一起的一個內容。如果你能幫忙。謝謝:) – 2012-02-01 13:50:35

週期jQuery UI的選項卡上的「上一頁」和「下一步」按鈕

回答

相關問題