0 
<div id="dialog"><img src="images/load.gif"/></div>

我有这个之前播放的 gif，document.ready我正试图在页面准备好后关闭它。我试过了：

<script type="text/javascript">
$("#dialog").dialog('option', 'dialogClass', 'alert'); //show dialog modal while page is loading

$(document).ready(function() { //document is ready, close loading gif
$("#dialog").dialog('destroy');

此代码有效，但不会删除加载 gif，它仍会显示在页面上。我尝试添加$('#dialog').remove()，但这似乎通过不让页面的其余部分执行来“破坏”我的页面。

页面准备好后如何删除此对话框？

4

3 回答 3

1

在你的 CSS

#dialog {
display: none;
}
于 2012-10-09T01:39:35.113 回答
0

你试过这个吗？

$("#dialog").hide();
于 2012-10-09T01:42:21.930 回答
0

首先，在使用 jQuery 方法之前，最好等待 DOM（以及 JQuery 库）被加载。

其次，除非你是通过Ajax加载内容，否则显示一个对话框等待框并立即删除它有点没用（对话框创建和对话框销毁之前的时间非常短）。

此外，与 destroy 一起使用的对话框函数不会删除原始 HTML 代码。它仅删除对话框创建期间对话框插件所做的所有修改。

所以，当你申请

$("#dialog").dialog('destroy');

您只需删除包装在

<div id="dialog"><img src="images/load.gif"/></div>

但不是它自己的DIV。

在我看来，最好的方法是使用经典的 HTML 和 CSS 添加微调器，当页面加载并加载 jQuery 时，稍等片刻然后将其删除。

你可以拥有这段 CSS

#dialog
{
    position: absolute;
    width: 100%;
    height: 100%;
    opacity: 0.8;
    background-color: grey;
    text-align: center;
    padding-top: 50px;
}

和这段 Javascript

$(document).ready(function() {

    // Wait a short delay, animate opacity and finally remove
    $("#dialog").delay(300).animate({
        "opacity" : 0
    }, 500, function() {
        $("#dialog").remove();
    });

});

祝你好运

于 2012-10-09T01:43:18.833 回答