页面加载时未显示对话框 - Dialog not appearing on Page load

Dialog not appearing on Page load

本文关键字：显示对话框加载 | 更新日期: 2023-09-27

我有一个php页面，它将数据插入数据库，插入后重定向到另一个页面，我希望在插入数据时，我可以向用户显示一个对话框，插入几乎需要2分钟，所以我在页面开始时写了这段代码

    <script src="../js/jquery-1.9.1.min.js"></script>
    <script src="../js/jquery-ui-1.10.2.custom.min.js"></script>
    <link rel="stylesheet" href="../css/jquery-ui.css" />
</head>
<script>
    function dialogsf() {
        $("#loadingsf").dialog({
            hide: 'slide',
            show: 'slide',
            autoOpen: true
        });
        $("#loadingsf").dialog('open').html("<p>Please Wait...</p>");
        alert("dfsd");
    }
    window.onload = function() {
        dialogsf();
    };
</script>
<body>
    <div id="loadingsf" title="Import"> 
        <p>Please wait ...</p>
    </div>

插入时没有出现对话框，我尝试了javascript:dialogsf()；从URL选项卡，然后我可以看到对话框，我错过了什么吗？

请尝试以下脚本。<p>和</p>标签在打开的对话框中。

function dialogsf() {
        $("#loadingsf").dialog({
            hide: 'slide',
            show: 'slide',
            autoOpen: true
        });
        $("#loadingsf").dialog('open').html("Please Wait...");
    }
$(function () {
    dialogsf();
    });

在jsfiddle这里查看http://jsfiddle.net/parixit572/WNQ3B/1/

注意：这是一个"暗示性"答案，用作示例。

这是我上传文件时使用的东西，它对我有效，你可以基于这个想法。

当一切发生时出现的弹出框，在我上传完成后自动消失，也可以为你工作。

HTML

<div id="load" style="display:none;"><br><br>Uploading... Please wait.<br><hr><br>Do not close this window until it has finished.</div>
<form action="upload.php" method="post" enctype="multipart/form-data" accept-charset="ISO-8859-1" name="form1" id="form1" onsubmit="return checkFields();">
<input type="submit" name="Submit" value=" Click here to UPLOAD when ready " />

CSS

<style type="text/css">
#load{
position:absolute;
z-index:1;
border:3px double #999;
background:#f7f7f7;
width:300px;
height:300px;
margin-top:-150px;
margin-left:-150px;
top:50%;
left:50%;
text-align:center;
font-family:"Trebuchet MS", verdana, arial,tahoma;
font-size:18pt;
}
</style>

JS

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript">
var ray={
ajax:function(st)
    {
        this.show('load');
    },
show:function(el)
    {
        this.getID(el).style.display='';
    },
getID:function(el)
    {
        return document.getElementById(el);
    }
}
</script>