Question

我正在尝试使用jQuery UI对话框提供一个小弹出窗口，其中显示有关客户的一些信息并显示表单。一切正常，但它只适用于第一次点击。如果我再次尝试再次单击相同的按钮，则会收到错误消息：

Uncaught Error: cannot call methods on dialog prior to initialization; attempted to call method 'option'

我已经设法弄清楚它与关闭/破坏对话框有关，但我不明白我做错了什么。如果我对部分$(this).dialog('destroy');发表评论，那么至少对话框有效，但我得到了不同的错误

Uncaught TypeError: Object Exclude something has no method 'dialog'

我用jquery-ui-1.9.2尝试过jQuery 1.8.3 / 1.9.1，我也遇到了同样的问题。

这就是我设置的内容：http://jsfiddle.net/ycZpQ/

Answer 1

编辑：我发现了真正的问题。

您指的是页面上的所有按钮，而不是明确决定哪些按钮。

$('button').click(function() {...});

将所有按钮附加到显示的对话框 - 包括里面对话框！

所以我会一步一步地解决这个问题，同时解决这个问题，我还发现你的代码存在其他一些主要是语义或不良实践的问题，我也会解决它们。

首先，按钮！通过对这些按钮进行区分而不是其他按钮，换句话说是一些常见因素，您可以确保不解决错误的按钮。

<div class="buttons"> ... </div>

然后：

$('.buttons').on('click', 'button', function() {
    ...
});

确保我没有在对话框内找到按钮。

这导致的是我所说的dumbloop：

点击按钮 - ＆gt;创建对话框

点击关闭按钮 - ＆gt;关闭对话框 - ＆gt;再次打开对话框（因为这也是一个按钮）

现在导致错误的问题是您为对话框提供标题的部分：

.dialog('option', 'title', $(this).attr('title'))

^在这里，因为按钮是关闭按钮，你试图解决其标题，而不是“排除”按钮，导致错误 - 因为这是一个虚拟按钮那只是被丢弃了！它也没有标题！

这就是为什么错误是指对象排除某些东西，这显然不是一个对象，而是对话框的标题。关闭按钮在关闭/打开阶段之间以某种方式接收到该对象ID。

http://jsfiddle.net/ycZpQ/7/＆lt; - 这是一个最终的JS小提琴，只有一个对话框初始化，只在需要时打开对话框，这是对话框可重用时使用此对话框系统的最有效方式在这种情况下。

关于代码中更多编辑的注释：我对对话框创建的外观进行了一些更改，主要是语义，但注意我是如何定义按钮的 - buttons对象是一个带有属性按钮的对象，而不是具有属性的按钮对象数组。更高效，更轻松的眼睛。

Answer 2

当单个页面使用不同版本的jquery-ui.css，jquery-ui.js和jquery.js时，我遇到了此问题。为了解决这个问题，我刚刚使用了相同版本的Jquery文件

Answer 3

您需要了解.on jquery method，

然后尝试这样的事情：

$('.dialog-edit').on("click", function(){
    $(this).dialog({ .... });
});

在关闭对话框中尝试

$('.dialog-close').on("click", function(){
        $(this).dialog("close");
    });

P.S。始终使用class not id。这是更好的方式

Answer 4

嗯，destroy（）方法实际上是从对话框类中取消绑定容器。换句话说，它会删除功能。

如果要关闭对话框，则需要使用close（）方法。 Check it out in their doc

编辑：只有在不需要再次使用对话框时才能调用destroy（）方法。

未捕获错误：在初始化之前无法调用对话框上的方法;试图调用方法'选项'

4 个答案: