使用javascript完成清單緩存時的警報

cache.manifest在html5應用程序中下載所有文件時，如何警告成功消息？（Bascially完成緩存下載的成功警報）！使用javascript完成清單緩存時的警報

感謝

2012-08-22 Dave Homer

我的應用程序是大約43 MB（由於大png文件）我需要確保ipad緩存所有數據之前，我離線。 –

好得益於花園侏儒http://gardengnomesoftware.com/wiki/Cache_Manifest_File

非常深思熟慮的文章

我找到了答案。所有你需要做的是創建一個div將加入給你的頁面顯示緩存的狀態：

<div id="cachestatus" style="position:fixed;left: 2px;top: 2px; width: 150px;height:18px;color: #ff0000;padding: 1px 3px; opacity:1; z-index:100; font-family:Arial, Helvetica, sans-serif; opacity:0.2;"></div>

和這個div添加以下Java腳本恰到好處後：

<script type="text/javascript"> 

    var cacheStatus = document.getElementById('cachestatus'); 
    cacheStatus.innerHTML="cache status"; 


    if (navigator.onLine) { 
     window.applicationCache.addEventListener('updateready', function(e) { 
      if (window.applicationCache.status == window.applicationCache.UPDATEREADY) { 
       window.applicationCache.swapCache(); 
       cacheStatus.innerHTML="update ready!"; 
       if (confirm('A new version of this page is available. Reload?')) { 
        window.location.reload(); 
       } 
      } 
     }, false); 
     window.applicationCache.addEventListener('cached', function(e) {cacheStatus.innerHTML="cache is ready!"; },false); 
     window.applicationCache.addEventListener('noupdate', function(e) { cacheStatus.innerHTML="cache is up to date!"; },false); 
     window.applicationCache.addEventListener('downloading', function(e) { cacheStatus.innerHTML="downloading..."; },false); 
     window.applicationCache.addEventListener('error', function(e) { cacheStatus.innerHTML="error"; },false); 
     window.applicationCache.update(); 
    } else { 
     cacheStatus.innerHTML="offline"; 
    } 
</script>

緩存的狀態將顯示在DIV中。

來源

2012-08-24 08:49:27

您可以綁定到window.applicationCache對象的各種事件。其中之一是updateready事件。

您還必須確保爲用戶正確地重新加載任何緩存更新。請參閱以下article，其中涵蓋了應用程序緩存基本知識，其事件以及如何以編程方式處理更新。

，你應該是指在處理與應用程序緩存的一些其他物品有：

來源

2012-08-22 09:21:57 Romin

使用javascript完成清單緩存時的警報

回答

相關問題