如果 HTML 文件已更新，则执行 JavaScript [关闭]答案

【问题标题】：Execute JavaScript if HTML file has been updated [closed]如果 HTML 文件已更新，则执行 JavaScript [关闭]
【发布时间】：2012-12-09 23:28:21
【问题描述】：

如果有必要，我正在尝试在 JavaScript、jQuery 甚至 PHP 中查找插件或函数，以每 10 秒检查一次页面文件是否已更新，并在页面已更新时提醒（）用户。

在此先感谢 :) 对不起，如果我不够清楚。如果您有任何问题，请发表评论。

编辑： 换句话说，使用客户端或服务器端脚本，向服务器发送 AJAX 请求并确定用户打开的当前页面是否已在服务器上被修改并显示警报.

【问题讨论】：

您应该分享更多关于您在什么情况下尝试执行的操作的信息。这是做什么用的，你控制正在更新的页面等等。
@Pekka 刚刚更新了问题。
信息还不够。您到底想做什么，您是否控制正在更新的页面？
数据库更新是否提供了页面的潜在变化？
@Pekka 每 10 秒我想要一个 AJAX 请求来确定自用户打开页面后 page.html 是否已被修改/更新。例如，如果我在 4:00 加载 page.html 并在 4:01 对其进行编辑，则会向用户显示一条消息，说明页面已更新。

标签： php javascript jquery refresh

【解决方案1】：

您可以每 10 秒向服务器发送一个 http HEAD 请求。这将使服务器只发送标头而不是内容。然后您可以检查“Last-Modified”响应标头。

jQuery 函数$.ajax(); 支持与此非常相似的功能。但不是检查Last-Modified http 标头 jQquery 使用http If-Modified-Since 标头向服务器发送请求。然后它会检查服务器是否以响应代码 304 Not Modified 进行响应。

这是一个简短的 HTML + Javascript 示例，描述了 jQuery 功能：

<html>
  <head>
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.8.3.min.js"></script>
    <script type="text/javascript">
      var checkUrl="test.txt";
      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>

但是，上面的 jquery 示例对我不起作用 - 使用 jQuery 1.8 和 firefox.(Linux) + apache2 Web 服务器。尽管服务器响应 304 Not Modified，但仍会调用成功函数。

所以我将添加另一个 working 示例来实现我上面的第一个建议，这里是 javascript 部分：

    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');
                }
            }
        }); 
    }

【讨论】：

我不是 JavaScript 或 PHP 方面的专家。您能否提供一个示例或 sn-p 说明如何做到这一点？
这个脚本看起来不错，今晚晚些时候我会试试看，但是我注意到在你的描述中你提到了“page.php”，但在你的脚本中是 checkUrl-“test.html/txt”。