2014-10-28 166 views
0

我是javascript/jquery世界的新手。加载图像直到页面加载后才显示。

我想显示加载图像,直到我的页面加载完成。我不知道我哪里错了。我已经阅读了很多关于这方面的文章,但是我的图片和脚本都不起作用。请看下面我的标记。我已经尝试使用response.write(html字符串)和response.flush来排序它,它的工作原理,但我有一个主要问题在response.redirect头已经发送作为刷新导致html缓冲区刷新。我在脚本标记中使用了与下面相同的代码,除了没有window.load位。这是由于我把我的response.write和刷新页面事件init &预渲染。窗口加载后隐藏图像

<script type="text/javascript"> 
     $(window).load(function() { 
      $("#dvLoading").hide(); 
      }); 
    </script> 

注意 - 上面的脚本之前,请确保您已经添加jQuery库:

<!DOCTYPE html> 
<html lang="en"> 
<head runat="server"> 
    <meta charset="utf-8" /> 
    <title><%: Page.Title %> - InfoCentre MI TEST VERSION</title> 
    <asp:PlaceHolder runat="server">   
     <%: Scripts.Render("~/bundles/modernizr") %> 
    </asp:PlaceHolder> 
    <webopt:BundleReference runat="server" Path="~/Content/css" /> 
    <link href="~/favicon.ico" rel="shortcut icon" type="image/x-icon" /> 
    <meta name="viewport" content="width=device-width" /> 
    <asp:ContentPlaceHolder runat="server" ID="HeadContent" /> 
    <script type="text/javascript"> 
     $(window).load = function() { 
      var elem = document.getElementById("dvLoading"); 
      elem.parentNode.removeChild(elem); 
      } 
    </script> 
</head> 
<body> 
    <div id="dvLoading" style="text-align:right;"> 
     <img id="imgLoading" src="Images/loading4.gif" width="100" height="100" alt="LoadingImage" /> 
    </div> 
    <form runat="server"> 
</body> 

回答

1

试试这个。如果没有,那么前<script>标签

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
<script type="text/javascript"> 
    $(window).load(function() { 
      $("#dvLoading").hide(); 
     }); 
</script> 

下面添加行欲了解更多有关加载事件 - jQuery load

+0

我没有CSS。我刚从一个已经离开的人那里继承了这个项目,他没有任何CMS。现在唯一的问题是页面加载时显示图像。果然,我可以使用上面的代码清除图像,但我不能在没有使用CSS的情况下显示它。无论如何,我可以做到这一点,没有CSS请。 – 2014-10-28 14:09:50

+0

你在说什么css?你可以发布的CSS代码,它是如何影响你的代码?按照你想在页面加载后隐藏图像的问题? – 2014-10-29 04:28:42

+0

我不仅要加载隐藏它。我也想在页面加载时显示一个。对于这个互联网上的所有教程建议把一个div直接放在body标签之后,然后通过css将它添加到它。当我这样做时,页面上的所有其他元素都消失了。它很烦人。 – 2014-10-29 09:08:01

1

我必须说谢谢你的快速回复。我尝试了以下。它本质上是我写的东西的一个细分版本。但它的工作。可能是我在最后错过了分号。

<script type="text/javascript"> 
     function removeimage() { 
     var elem = document.getElementById("dvLoading"); 
     elem.parentNode.removeChild(elem); 
     } 
     window.onload=removeimage 
</script> 

现在唯一的问题是我的图片需要显示,而我的网页正在加载。此刻,它只是闪烁一秒,但随后上面的代码将其删除。 GRRRR。所有的帮助表示赞赏。

+0

我已经使用ajax工具在asp.net中使用更新面板等。 – 2014-10-29 15:39:08

相关问题