请提供一些settimeout()示例,以便在IE中使用loader.gif图像

时间:2010-06-25 09:45:49

标签: javascript html loader settimeout

我一直试图在提交表单时显示Loader.gif图像,它可以正常使用FF浏览器,但无法使用IE浏览器,我尝试使用javascript的settimeout()函数来帮助解决问题IE,但后来它没有使用FF

所以有人可以为FF和IE提供一个详细的工作示例??

1 个答案:

答案 0 :(得分:1)

如果您要上传图片,可以使用CSS(display: none;)隐藏loader.gif,然后在表单onSubmit事件中添加类似document.getElementById("loaderImageID").style.display = "block";的内容(或者代替块,等等)您需要的显示类型)在用户点击提交/上传/任意按钮后显示图像,当页面刷新时图像将消失。

(除非我误解了你要做的事情,否则我认为不需要setTimeout())

修改 好的,这是代码的更新副本(应该完全按照您现在需要的方式工作)

<html>
    <head>
        <script type="text/javascript">
            function uploading()
            {
                //Show the placeholder div
                document.getElementById("loader").style.display = "block";

                //Create a new image element with the loader.gif as the source
                var loader = document.createElement("img")
                loader.setAttribute("src","loader.gif");
                //Add the loader image to the loader div
                document.getElementById("loader").appendChild(loader);
            }
        </script>
    </head>
    <body>
        <!-- Placeholder for the loader (style it as you wish)-->
        <div style="display: none; height: 50px; width: 50px;" id="loader"></div>
        <a href="javascript: uploading();">Test</a>
        <form onSubmit="uploading();">
            <input type="submit" onClick="uploading();"/>
        </form>
    </body>
</html>

我使用了您链接到的网站上的加载程序并开始遇到同样的问题。问题是由于元素在添加到DOM时不可见而导致的。之后当你显示元素时,IE不会启动动画。 (source