jquery ui对话框关闭后将不会重新打开

我正在尝试实现一个jQueryUI对话框。作为基地，我成功了。但是我宁愿使用元素的类而不是ID。因此，我将代码修改为：

$(document).ready(function() {
    $(".add_shipping_address").click(function() {
        console.log($(this).parents('.shipping_sector')); //correctly returns the parent fieldset
        $(this).parents('.shipping_sector').find(".shipping_dialog").dialog();
        return false;
    });
});

对话框第一次工作，但一旦关闭，将不会再次打开。然而，它在源代码示例中按预期工作。我怎么把它弄坏了

---

可能是对话框的父级结构已更改

试着把它改成

//jquery dialog functions
$(document).ready(function() {
    $(".add_shipping_address").click(function() {
        //console.log($(this).parents('.shipping_sector'));
        $(".shipping_dialog").dialog();
        return false;
    });
});

---

jQuery对话框的工作方式是将对话框的HTML从DOM中的当前位置取出，并在DOM底部放置一个新的

div

。打开对话框时，新位置的定义如下所示

因此，HTML不在原来的位置，使用

find

的选择器也不会找到任何内容

您必须直接使用

id

或类名，但如果该类有多个元素，则最好使用标识符

在我们的项目中，我们用一个id专门为对话框创建一个新的div，然后我们知道它是哪一个。您可以将实际内容放入新容器中，也可以将其

克隆（）

并放入其中。与此类似：

var $dialog = $('<div id="dialog-container"></div>')
var $content = $(this).parents('.shipping_sector').find(".shipping_dialog");

var $clonedContent = $(this).parents('.shipping_sector').find(".shipping_dialog").clone() // use clone(true, true) to include bound events.

$dialog.append($content); // or $dialog.append($clonedContent);

$dialog.dialog();

---

如果您不介意每次都创建一个新的对话框，那么您基本上可以销毁对话框并将内容移回以前的位置。这样，在下一次单击时，该过程将重复

//jquery dialog functions
$(document).ready(function() {
    $(".add_shipping_address").click(function() {
        var sector = $(this).parents('.shipping_sector');
        sector.find(".shipping_dialog").dialog({
            close: function(event, ui) 
            { 
                $(event.target).dialog('destroy');
                $(event.target).appendTo(sector);
            }
        });
        return false;
    });
});

---

您当前的代码是：

$(".OpenDialogOnClick").dialog();

只需将其更改为：

$(".OpenDialogOnClick").clone().dialog();

---

瞧，你的HTML将永远不会被销毁/删除：）

你的控制台中有任何错误吗？你是否将其从DOM中删除？你使用的是什么浏览器？只是一个旁注小心使用console.log。除非打开开发人员工具，否则并非所有浏览器（例如ie）都会自动将控制台绑定到浏览器。这让我以前犯过一个错误。通常，最好先执行以下操作：

if（window.console&&window.console.log）

，然后再尝试写入控制台，以避免在Internet Explorer等构建糟糕的浏览器中出现错误。如果

console

little成为一个问题，这是一个很好的解决方案。它使用普通控制台方法创建一个“虚拟”控制台对象，但仅当它在

localStorage.debug

中找到

truthy

值且控制台对象存在时。它允许您在代码中保留

console.log（）

条目，而不用担心它们会引起问题。只有当console对象存在并且您显式设置了

localStorage.debug=true

I see时，您才会看到日志输出。那么，如果使用

parents（'.adf'）.find（'.dialog'）.dialog（）找不到“最近的”对话框，那么如何使页面具有多个没有特定ID的对话框方法？谢谢@托马斯：我增加了一些选择。我将不能给你一个复制粘贴解决方案，因为一些重组将是必需的，我不知道你的所有代码。通常，您可以创建一个临时div，给它一个唯一的标识符，并在打开后将该容器用作当前对话框内容的引用。一个对话框销毁div后，该div将再次消失，您可以根据需要重新创建它。有很多其他的方法可以做到这一点，但是任何一种方法都需要能够处理DOM的变化和jQuery移动HTML的方式……以及缺少向后移动，等等。这只适用于一个项目，但由于OP希望在ID上使用类，因此可以假定将有许多控件与“shipping_dialog”和“add_shipping_address”类一起使用。@areich完全正确。这种方法假设类只有一个成员。谢谢你！
$(".OpenDialogOnClick").clone().dialog();