Javascript jQuery对话框是否默认显示为隐藏？

我在一个简单的典型用例中使用jQuery对话框：

在Javascript中：

$('myDialog').dialog({
    modal: true;
});

在HTML中：

<div id="myDialog" title="Dialog Title">
    Dialog contents here
</div>

此处的对话框内容

但是，我用来控制

myDialog

div的布局和外观的CSS托管在本地机器无法访问的服务器上（不要问为什么）。因此，在Firebug中，我看到一个网络404错误，CSS文件没有找到文件

当我在本地测试这个对话框时，它显示得非常好。然而，我刚刚注意到，在触发执行对话框调用的代码之前，

myDialog

div的内容实际上显示在我的HTML页面上

因此，这让我相信两件事中的一件：

• 默认情况下，jQuery对话框各自的
  元素不可见/隐藏；然而，浏览器找不到CSS文件的这种奇怪情况导致
  在对话框出现在屏幕上之前就显示给用户；或
• 默认情况下，jQuery对话框各自的
  元素是可见的，我必须采取措施在页面加载时隐藏它

有人能告诉我这两个断言中哪一个是正确的吗？

如果前面的断言是正确的，那么当我们将代码推送到开发环境（开发环境确实可以访问CSS文件）时，问题应该会自行解决

如果后一个断言是正确的，那么如何在页面加载时隐藏

myDialog

div

---

提前谢谢

第二个差不多是正确的。当页面加载时，

是可见的，因为默认情况下HTML中的所有

都是可见的。jQuery只是稍后才出现的

您只需在默认情况下隐藏

，并让

.dialog

决定何时显示它，例如：

CSS:

HTML:

此处的对话框内容

---

如果您不这样做，那么如果在页面加载时对话框不应该立即打开，情况将从“不受欢迎”恶化为“不可接受”

你的第二个断言是正确的。在div上调用

.dialog（）

，立即显示对话框

您可以将自动打开选项设置为false

$('foo').dialog({
    autoOpen: false,
    title: 'I\'m hidden',
    width: 500,
    height: 500
});

<div id="myDialog" class="hidden" title="Dialog Title">
    Dialog contents here
</div>

$('foo').dialog({
    autoOpen: false,
    title: 'I\'m hidden',
    width: 500,
    height: 500
});