2014-10-28 168 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

相關問題