是否可以在 jquery ui 对话框中粘贴 jquery ui 选项卡答案

【问题标题】：is it possible to stick jquery ui tabs inside of a jquery ui dialog是否可以在 jquery ui 对话框中粘贴 jquery ui 选项卡
【发布时间】：2011-03-17 14:45:19
【问题描述】：

我有一个网页，我想动态加载（ajax）到一个 jquery ui 对话框中。该页面有多个 jquery 选项卡，当我将其加载到对话框中时，每个选项卡都显示为常规链接，并且未显示选项卡小部件。这是一个已知的问题？是否有任何解决方法来支持在对话框中包含 jquery ui 选项卡。

【问题讨论】：

您是在对话框打开回调中运行 tabs() 代码还是作为正在加载的页面上的脚本（必须在 body 元素中）？

标签： jquery jquery-ui-dialog jquery-ui-tabs

【解决方案1】：

是的，这是可能的。这是一个简单的例子......

JS Fiddle Example

【讨论】：

感谢您的示例。 .我在示例中看到的唯一不同是选项卡本身是动态填充的，但我将进行更多测试

【解决方案2】：

您可能希望添加一个打开的处理程序来检索您的内容并在您这样做时设置选项卡。

$(function() {
    $('#dialog').dialog({
        autoOpen: false,
        modal: true,
        buttons: {
            'OK' : function() {
                        $(this).dialog('close');
                   },
            'Cancel': function() {
                        $(this).dialog('close');
                   }
        },
        open: function(event,ui) {
           $(ui.panel).find('div')
                      .load('http://www.example.com')
                      .find('.tabs')
                      .tabs();
        }
    });
    $('.dialog-button').click( function() {
        $('#dialog').dialog('open');
        return false;
    });
});

<div id="dialog"  title="Dialog" style="display: none;">
    <div class="dialog-content">
    </div>
</div>

【讨论】：