Jquery ui dialog 找到恢复JQuery UI对话框的方法'；s函数

我试图找到一种方法来恢复jQuery UI对话框的dialog（）调用

我在应用程序中首先要做的是调用div上的对话框：

$('#dialog').dialog({
...options
});

然后，一旦用户按下关闭按钮，我希望div标记及其内容再次出现在调用dialog（）之前的同一位置，而不是jQuery对话框中

我试过这个：

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

但它不起作用。调用dialog（'destroy'）时，#对话框的内容似乎被清空

有什么想法吗

谢谢，

---

Jimmy

也许你能做的是将dialog复制到一个新的div中，并将dialog（）复制到该div中，保持原始div不变。

事实上，这比直接的html（）或append（）要困难一些，因为在我的div中，我有一个jQuery datatables组件+一堆其他自定义事件。因此，我首先必须用所有事件深度克隆它的子代，然后在正确的位置调用fadeIn（）fadeOut（）。所以我要说：

HTML（在#dialog2 div中克隆#dialog子项）：

渲染引擎
浏览器
月台
引擎版本
CSS等级
三叉戟
互联网
浏览器4.0
赢得95分+
4.
X
三叉戟
互联网
浏览器5.0
赢得95分+
5.
C
渲染引擎
浏览器
月台
引擎版本
CSS等级
分开我

JavaScript：

    <script type="text/javascript">
    $(document).ready(function(){

$("#dialog").children().clone(true, true).appendTo($("#dialog2"));
    $('#dialog2').hide();
    $('#open').click(function(){
         $('#dialog2').fadeOut();
         $("#dialog").dialog({
          width: 1000,
          height:800,
          close : function(){
             $('#dialog2').fadeIn();
             return true;
          }
         });
    });

 this.datatable = $('table').dataTable({
   "fnRowCallback": function(nRow, aData, iDisplayIndex, iDisplayIndexFull) {
        $(nRow).on('click', function(){
            $(this).addClass('selected', true);
        });
        }
  });
});

</script>

$（文档）.ready（函数（）{
$（“#dialog”）.children（）.clone（true，true）.appendTo（$（“#dialog2”）；
$（'#dialog2'）.hide（）；
$（“#打开”）。单击（函数（）{
$（'#dialog2'）.fadeOut（）；
$（“#对话框”）。对话框({
宽度：1000，
身高：800，
关闭：函数（）{
$（'#dialog2'）.fadeIn（）；
返回true；
}
});
});
this.datatable=$（'table'）.datatable({
“fnRowCallback”：函数（nRow、aData、iDisplayIndex、iDisplayIndexFull）{
$（nRow）.在（'单击'，函数（）上）{
$（this.addClass（'selected'，true）；
});
}
});
});

好的，谢谢，我将尝试使用html（）或clone（）函数来实现这一点，它肯定会起作用。然而，我想知道是否有一个revertOnClose选项，在同一个div上工作会很好。

    <script type="text/javascript">
    $(document).ready(function(){

$("#dialog").children().clone(true, true).appendTo($("#dialog2"));
    $('#dialog2').hide();
    $('#open').click(function(){
         $('#dialog2').fadeOut();
         $("#dialog").dialog({
          width: 1000,
          height:800,
          close : function(){
             $('#dialog2').fadeIn();
             return true;
          }
         });
    });

 this.datatable = $('table').dataTable({
   "fnRowCallback": function(nRow, aData, iDisplayIndex, iDisplayIndexFull) {
        $(nRow).on('click', function(){
            $(this).addClass('selected', true);
        });
        }
  });
});

</script>