Jquery对话框未在指定的div中加载-Jquerydialognotloadedwithinspecifieddiv

I observe that a Jquery dialog loaded using load() is not loaded within the matched element. Here's my parent document:

我观察到使用load（）加载的Jquery对话框未在匹配的元素中加载。这是我的父文件：

  
  
  

  



  Click

  

and the document containing the dialog that is loaded:

和包含加载的对话框的文档：

  
Text

#loaded-dialog-wrapper is loaded, but it does not contain #loaded-dialog; it only has the script node. Instead, #loaded-dialog is contained inside a div that is added as a child to the body node. If I close the dialog, the dialog goes away, and when I click the button again, the dialog is displayed and a new div is created in the same manner as before. If I change the contents inside #loaded-dialog, on the second opening, the dialog that is displayed does not contain the updated content. However, the #loaded-dialog containing the new content is contained in the second created div.

#loaded-dialog-wrapper已加载，但它不包含#loaded-dialog;它只有脚本节点。相反，＃loaded-dialog包含在作为子节点添加到body节点的div中。如果我关闭对话框，对话框就会消失，当我再次单击该按钮时，将显示对话框，并以与以前相同的方式创建新的div。如果我更改＃loaded-dialog内的内容，则在第二个打开时，显示的对话框不包含更新的内容。但是，包含新内容的#loaded-dialog包含在第二个创建的div中。

2 个解决方案

$('#button1').on('click',function() {
  $('#loaded-dialog-wrapper').dialog(dialogOpts).html('Place your message here');
});

var dialogOpts = {
  width: 600,
  height: 400,
  modal: true,
  autoOpen: false,
  draggable: false,
  buttons: [{text: "Close", click: function() { $(this).dialog("close");} }],
  close: function() {
    $('#loaded-dialog').dialog('destroy'); // To remove the Jquery stuff
    $('#loaded-dialog').remove(); // To remove the div
  },
};