在jQuery UI對話框中放置一個jQuery UI手風琴

通過爲Tabs創建適當的標記，我可以在jQuery UI對話框中放置一個jQuery UI Tabs小部件;但對手風琴做同樣的工作還沒有奏效：點擊手風琴部分的錨點會導致關閉對話框。有沒有簡單的方法來完成這個？在jQuery UI對話框中放置一個jQuery UI手風琴

來源

2010-05-28 Tim

對我來說工作很好...我爲你貼了a demo。

也許你需要使用對話框中的「打開」選項？

$(function() { 
    $("#dialog-modal").dialog({ 
     height: 400, 
     width: 400, 
     modal: true, 
     open: function(){ 
     $("#accordion").accordion({ autoHeight: true }); 
     } 
    }); 
    });

注意：對於標籤，它基本上是一樣的東西，在open選項中添加函數調用。

來源

2010-05-28 14:05:36 Mottie

非常感謝！奇蹟般有效。不知道爲什麼我的Dialog在手風琴部分頭被點擊時關閉。它的設置與你的一樣，雖然我的模式不是，例如，我也有多個可疊放的對話框;但我改變了你的例子來反映這些差異，它仍然有效。現在，我知道這是可能的，我可以搜索可能會導致我的網頁上的問題。再次感謝。 – Tim 2010-05-28 16:49:22

您可以爲對話框創建一個div，併爲手風琴創建一個div。

HTML摘錄：

<button id='clicker>Click Me</button> 
<div id='dialog'> 
    <div id='accordion'> 
     <h3>Section 1</h3><div><p>Sec 1 Fun</p></div> 
     <h3>Section 2</h3><div><p>Sec 2 Fun</p></div> 
    </div> 
</div>

JavaScript代碼段：

$('#clicker').button().click(function(){ 
    var overlayDialogObj = { 
     autoOpen: true, 
     height: 400, 
     width: 310, 
     modal: false, 
     open: function(){ 
      $('#accordion').accordion(
       {heightStyle: "fill", collapsible: true}).show(); 
     }, 
     buttons: { 
     'Done': function() { 
      $(this).dialog('close'); 
     } 
     } 
    }; 

    $('#dialog').dialog(overlayDialogObj).show(); 

});

在這裏看到的小提琴： http://jsfiddle.net/saylesc/RDwUj/2/

來源

2013-08-20 17:37:45 Corndog

在jQuery UI對話框中放置一個jQuery UI手風琴

回答

相關問題