如果HTML文件已更新,则执行JavaScript 2

时间:2013-11-25 14:00:07

标签: javascript ajax jquery http-headers

this page我得到了一个很好的答案,请参阅下面的代码。 我遇到一个问题。

此脚本正在检查自身。代码在index.html中,它将检查index.html上是否有更改。如果有变化,它应该刷新自己。一切正常,但它保持相同的状态。

因此,如果您更改文件一次,它将循环说“网站已被修改”并刷新。有人知道如何解决这个问题吗?

<html>
  <head>
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.8.3.min.js"></script>
    <script type="text/javascript">
      var checkUrl="index.html";
      var firstCheck = false;
      window.setInterval("checkForUpdate()", 1000);

      function checkForUpdate() {
          $.ajax(checkUrl, {
              ifModified : true,
              type : 'HEAD', 

              success : function (response) {
                  if(firstCheck === false) {
                      firstCheck = true;
                      return;
                  }
                  $('#output').html('the site has been modified');
              }
          }); 
      }    
   </script> 
  </head>
  <body>
    <div id="output">Not Modified</div>
  </body>
</html>

1 个答案:

答案 0 :(得分:1)

您的代码来源承认它不起作用并提供替代解决方案:

var checkUrl="test.txt";
window.setInterval("checkForUpdate()", 1000);
var pageLoad = new Date().getTime();

function checkForUpdate() {
    $.ajax(checkUrl, {
        type : 'HEAD',
        success : function (response, status, xhr) {
            if(firstCheck === false) {
                firstCheck = true;
                return;
            }
            // if the server omits the 'Last-Modified' header
            // the following line will return 0. meaning that
            // has not updated. you may refine this behaviour...
            var lastModified = new Date(xhr.getResponseHeader('Last-Modified'))
                .getTime();
            if(lastModified > pageLoad) {
                $('#output').html('the site has been modified');
            }
        }
    }); 
}