重用现有jqueryui对话框

我正在编写一个chrome扩展，当用户单击上下文菜单时，它会在页面上添加一个弹出窗口。我使用activeTab权限执行此操作，将一个脚本注入到获取所选文本的页面中，对其执行一些操作，并将信息添加到页面上的浮动div中。这个div是一个jqueryui对话框

问题是，由于activeTab的工作方式，我的脚本无法保持任何状态—每次单击上下文菜单时，脚本都会被重新注入并重新运行。如果我不关闭对话框，我可以毫无困难地向其中添加内容。但是如果我关闭对话框，我希望能够重用已经创建的对话框，但我不知道如何做

下面是一些代码：

// Creating the dialog
function createDialog() {
  if (!$('#language_study_dialog').exists()) { // exists() just checks length>0
    console.log("Dialog not created; creating now");
    $('body').append('<div id="language_study_dialog" title="Language Study">'
        + '</div>');
    $('#language_study_dialog').dialog({position:
        {my: "left top", at: "left top"}
    });
  }
  $('#language_study_dialog').dialog("open");
}

// Because I don't have any state, I need to call this every time; I don't
// know if the dialog has been created already or not.
// `selection` is defined elsewhere
createDialog();
$('#language_study_dialog').append("<p>Word: " + selection + "</p>");

//创建对话框
函数createDialog（）{
如果（！$（“#语言研究对话”）.exists（）{//exists（）只检查长度>0
log（“未创建对话框；正在创建”）；
$（'body'）。附加（'
+ '');
$（“#语言(学习)对话框”）。对话框（{位置：
{my:“左上”，at:“左上”}
});
}
$（“#语言研究对话”）。对话（“打开”）；
}
//因为我没有任何状态，每次我都需要打电话给它；我不
//知道对话框是否已经创建。
//“选择”在别处有定义
createDialog（）；
$（“#语言研究对话”）。追加（“单词：“+selection+”
”）；

如果我运行这个脚本两次，而不关闭中间的对话框，一切都会正常工作——文本会按预期添加，现在额外的元素会添加到DOM中。但如果在连续执行此脚本之间关闭对话框，则会出现错误（

无法在初始化之前调用对话框上的方法）

另一方面，如果我调用
$（'language\u study\u dialog'）.dialog（）而不是上面的
createDialog
中的
dialog（“open”）
，大部分工作正常，但每次调用函数都会将jQuery UI对话框内容添加到DOM中，有时多个对话框会使事情变得混乱

是否存在只需重新初始化现有jQuery对话框的函数调用？我想我的替代方法是在关闭时删除除内部文本以外的所有内容，然后只保存一个隐藏的div，每次运行脚本时，我都会将其重新制作到一个对话框中。有更好的选择吗？
好的，我找到了，至少有一种方法。也许还有更好的办法，但这是有效的

我不能保留任何本地状态，因为每次单击上下文菜单时脚本都会重新执行。所以像
var dialog=$（“#语言_学习_dialog”）.dialog（）不工作-
dialog
每次运行脚本时都会重置。但是，我可以在
窗口中存储东西。因此，工作代码如下所示：

function createDialog() {
  if (window['dialog'] == undefined) {
    console.log("Dialog not created; creating now");
    $('body').append('<div id="language_study_dialog" title="Language Study">'
        + '</div>');
    window['dialog'] = $('#language_study_dialog').dialog({position:
        {my: "left top", at: "left top"}
    });
  }
  window['dialog'].dialog("open");
}

函数createDialog（）{
如果（窗口['dialog']==未定义）{
log（“未创建对话框；正在创建”）；
$（'body'）。附加（'
+ '');
窗口['dialog']=$（'language_study_dialog'）。对话框（{位置：
{my:“左上”，at:“左上”}
});
}
窗口['dialog']。对话框（“打开”）；
}
好的，我想出来了，至少有一种方法。也许还有更好的办法，但这是有效的

我不能保留任何本地状态，因为每次单击上下文菜单时脚本都会重新执行。所以像
var dialog=$（“#语言_学习_dialog”）.dialog（）不工作-
dialog
每次运行脚本时都会重置。但是，我可以在
窗口中存储东西。因此，工作代码如下所示：

function createDialog() {
  if (window['dialog'] == undefined) {
    console.log("Dialog not created; creating now");
    $('body').append('<div id="language_study_dialog" title="Language Study">'
        + '</div>');
    window['dialog'] = $('#language_study_dialog').dialog({position:
        {my: "left top", at: "left top"}
    });
  }
  window['dialog'].dialog("open");
}

函数createDialog（）{
如果（窗口['dialog']==未定义）{
log（“未创建对话框；正在创建”）；
$（'body'）。附加（'
+ '');
窗口['dialog']=$（'language_study_dialog'）。对话框（{位置：
{my:“左上”，at:“左上”}
});
}
窗口['dialog']。对话框（“打开”）；
}
我已经为您的问题提供了解决方案。请查看您当前的设计是否可行。您是否删除了您的答案？它遗漏了一个关键问题，因为我不能保留任何本地状态，因为每次都会重新运行脚本。但它确实让我找到了正确的答案——脚本在同一页上运行，因此我可以在
窗口中存储一个全局变量。因此，获取初始
dialog（）
调用的返回值并将其存储在
窗口['dialog']
中是可行的。奇怪的是，现在我又看到了你的答案。。。不知道是怎么回事。哦，好吧，那是你的问题…哦，我在答案中有一个愚蠢的拼写错误，所以只是更新了它。。。现在。。。可以使用“销毁”来清理对话框创建的混乱。正如您所说的，您可以将其存储在窗口中，因为您的脚本每次都会刷新…我为您的问题提供了一个解决方案，请查看您当前的设计是否可行。您是否删除了您的答案？它遗漏了一个关键问题，因为我不能保留任何本地状态，因为每次都会重新运行脚本。但它确实让我找到了正确的答案——脚本在同一页上运行，因此我可以在
窗口中存储一个全局变量。因此，获取初始
dialog（）
调用的返回值并将其存储在
窗口['dialog']
中是可行的。奇怪的是，现在我又看到了你的答案。。。不知道是怎么回事。哦，好吧，那是你的问题…哦，我在答案中有一个愚蠢的拼写错误，所以只是更新了它。。。现在。。。可以使用“销毁”来清理对话框创建的混乱。正如您所说的，您可以将其存储在窗口中，因为您的脚本每次都会刷新。。。