Javascript 带确认的jqueryui对话框

我有一个jQueryUI对话框，可以获取一行文本。如果此文本不包含在localStorage字典中，则将其插入字典中。如果存在，我想让用户选择不覆盖“ok”处理程序中的现有条目

由于jQuery UI对话框是有状态的，除非显式删除（AFAICT），否则会在多个调用中保持不变，因此我看不到一条清晰的路径来显示“您确定要取消上一个条目吗？”警报，而不诉诸于。。。UH警惕

问题简明扼要地说：您能从jQueryUI对话框中创建确认框吗

---

谢谢。

我没有使用jQuery UI对话框，但您可以随时创建自己的html元素，并对它们执行任何操作，包括将它们放在jQuery对话框的顶部。

我想您可以通过谷歌搜索找到以下链接：

不管怎么说，拥有它，开玩笑：

---

干杯

好的，我发现处理这个问题的最好方法是使用闭包。像这样（伪代码）：

getThingeName:handler（函数（）{
var$对话框；
$dialog=$（''）.html（“输入此内容的名称”
\n”）。dialog({
自动打开：错误
}, {
标题：“输入名称”，
莫代尔：是的，
按钮：{
添加：函数（）{
var值=$（'#dlg thingie name'）.val（）；
$（this.dialog（'close'）；
$（“#thingie name dialog”）.remove（）；
返回处理程序（值）；//销毁对话框并重新创建它相对容易。
$（'selector'）.dialog（'destroy'）.dialog（）
就可以了。尽管如此，我甚至不知道为什么对话框是有状态的会有问题。您可以随时配置有关它的内容，例如为单个调用显示的标题和文本。有状态的性质是客户端Web应用程序中的一个问题，它可能要显示多个对话框——在我的情况下，对话框是已经打开了对话。问题在于jQUI“记住”并重用了很多（状态），在某些情况下创建了被破坏的值和/或文本。我不能只销毁对话1，因为对话1的“是”处理程序的行为取决于对话2的“是/否”答案。我做过谷歌，也访问过这些链接（实际上是向后的——第一个指向确认，第二个指向对话框）。你发布的第二个链接实际上指向了一篇博客文章，解释了jQuery对话框的状态性质和一些副作用。第二个很有趣，但jQuery UI的吸引力在于主题的一致性。但是，是的，我知道如何使用谷歌，但不，我的结果不是我所希望的。
getThingieName: handler(function() {
  var $dialog;
  $dialog = $('<div id="thingie-name-dialog" class="ui-widget"></div>').html("<p>Enter a name for this thingie</p>\n<input type=\"text\" id=\"dlg-thingie-name\" style=\"width: 80%\" />").dialog({
    autoOpen: false
  }, {
    title: 'enter a name',
    modal: true,
    buttons: {
      Add: function() {
        var value = $('#dlg-thingie-name').val();
        $(this).dialog('close');
        $('#thingie-name-dialog').remove();
        return handler(value);                  // <= closure to handle the onAdd
      },
      Cancel: function() {
        $(this).dialog('close');
        return $('#thingie-name-dialog').remove();
      }
    }
  });
  return $dialog.dialog('open');
}),

getConfirmation: function(message, handler) {
  var $dialog;
  $dialog = $('<div id="confirmation-dialog" class="ui-widget"></div>').html("<p>" + message + "</p>").dialog({
    autoOpen: false
  }, {
    title: 'confirm overwrite',
    modal: true,
    buttons: {
      Ok: function() {
        $(this).dialog('close');
        $('#confirmatio-dialog').remove();
        return handler(true);               // <= closure to handle onOk
      },
      Cancel: function() {
        $(this).dialog('close');
        $('#Thingie-name-dialog').remove();
        return handler(false);              // <= closure to handle onCancel
      }
    }
  });
  return $dialog.dialog('open');
}

// Calling sequence
Snippets.getSnippetName(function(value) {
  if (value == null) return false;
  if (localStorage.getItem(value)) {
    getConfirmation("This thingie, " + value + ", already exists. Overwrite?", function(response) {
      if (response) return localStorage.setItem(value, snippet);
    });
  } else {
    localStorage.setItem(value, snippet);
  }
}