JQuery UI 模式对话框：无法在初始化之前调用方法

Question

我有以下几点：

$(function(){
    $('#dialog').dialog({ modal: true, buttons: { "Ok": function () { $('#dialog').dialog("close"); } } });
}

我尝试了许多不同形式的语法，但都没有成功。如果我使用 $(this).dialog("close"); 我会收到 JS 错误，抱怨在 init 之前调用方法，但是当我使用 $('#dialog').dialog("close") 它几乎可以工作。对话框在左上角弹出，按钮无法正确呈现 - 只是一个无文本的圆圈，在单击时 会关闭 - 只有当我给弹出框焦点时，模态叠加出现。

在我的 ASP.NET MVC 视图中：

@{
    if (Model.response)
    {
        <div id="dialog" title="@Model.responseDialog.title"><p>@Model.responseDialog.content</p></div>
    }
} 

Answer 1

好的，您的代码按预期工作。

这里有几件事可以尝试解决这个问题。

检查您的 css 和 javascript 文件

你需要相关的js和css文件，而不是重复或不同版本的jQuery。

您可以通过确保所有删除现有的并用 cdn 版本替换它们来测试这一点：

<link rel="stylesheet" href="//code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css" />
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.10.4/jquery-ui.js"></script>

调用对话框函数在引用之后

确保您的对话框函数位于上述引用之后。