Question

我有一个on page oad事件，用于检查我的清单状态，如果有更改，则会要求用户重新加载。但是，我正在尝试绑定<button>以手动检查noupdate上是否存在状态。我似乎无法让这个工作，这是我的代码：

window.addEventListener('load', function(e) {
  if (window.applicationCache) {
    window.applicationCache.addEventListener('updateready', function(e) {
      if (window.applicationCache.status == window.applicationCache.UPDATEREADY) {
          // Browser downloaded a new app cache.
          // Swap it in and reload the page to get the new hotness.
          window.applicationCache.swapCache();
          if (confirm('A new version of this App is available. Load it now?')) {
                window.location.reload();
          }
        } else {
          // no manifest change..
        }
    }, false);

    // if there is no update, display a message
    window.applicationCache.addEventListener('noupdate', function(e) {

      alert('App is up to date. ');

    }, false);

  }
}, false);

// check for a update each hour
setInterval(function () { window.applicationCache.update(); }, 3600000);

我的函数检测noupdate基本上会在页面加载时触发我的警报，但是如果我在与按钮绑定的函数中使用它...

<a href="javascript:refresh();" data-theme="a" data-role="button" 
data-icon="arrow-r" data-inline="true">Refresh</a>

<script>
    function refresh() {
        if (window.applicationCache) {
            window.applicationCache.addEventListener('updateready', function(e) {
              if (window.applicationCache.status == window.applicationCache.UPDATEREADY) {
                  // Browser downloaded a new app cache.
                  // Swap it in and reload the page to get the new hotness.
                  window.applicationCache.swapCache();
                  if (confirm('A new version of this App is available. Load it now?')) {
                        window.location.reload();
                  }
                } else {
                  // no manifest change..
                }
            }, false);

            // if there is no update, display a message
            window.applicationCache.addEventListener('noupdate', function(e) {

              alert('App is up to date. ');

            }, false);

          }
    }
</script>

它没有获得noupdate状态......

Answer 1

如果你在窗口加载时绑定事件监听器，如第一个代码块中所示，那么你需要在刷新函数中做的就是：

<script>
    function refresh() {
      applicationCache.update()
    }
</script>

调用applicationCache.update后，将触发“updateready”，“noupdate”或“error”事件。错误事件通常意味着无法下载appcache清单，因为服务器无法访问。您可能希望将侦听器绑定到此事件。

顺便说一句，如果您当前正在使用appcache，则无需调用window.applicationCache.swapCache()。只有当您想要更新资源（例如页面上显示的图像）而不重新加载页面本身时，才需要swapCache。 window.location.reload()足以完全重新加载所有资源，并且可以再次评估所有javascript等等。真正的重启。

Answer 2

这是因为noupdate事件仅在页面的load事件中触发。在加载页面时，浏览器将检查应用程序缓存，确定是否需要更新，然后触发事件。当您单击该按钮时，该事件已经被触发，因此您无法捕获它。

相反，您确实应该将事件附加到页面加载，但让updateready和noupdate事件更新变量，例如而是isUpToDate。然后，按钮的单击处理程序应检查isUpToDate变量并决定是否相应地刷新。

没有更新的HTML5 appCache事件

2 个答案: