无法弄清楚这个jQuery代码是如何工作的

本文关键字：何工作 工作 弄清楚 代码 jQuery | 更新日期: 2023-09-27 18:22:18

因此，有一台相机每隔几秒钟拍摄一次图像，并将这些新图像和新文件名存储在服务器上。当向"mypage"发出请求时，服务器端会加载最新的图像并在响应中返回。随后用这个jQuery代码刷新的图像：

(function($) {
    $(function() {
        var refreshInterval = 5;   // Number of seconds between image refreshes
        $('#deskshare-grid img').each(function() {
            $(this).data('src', $(this).attr('src'));
        });
        function refreshImages() {
            $.get('?r=' + Math.random(), function(response) {
                $('#deskshare-grid img').each(function(index) {
                    $(this).attr('src', $(response).find('#deskshare-grid img').eq(index).attr('src'));
                });
                setTimeout(refreshImages, refreshInterval * 1000);
            });
        }
        setTimeout(refreshImages, refreshInterval * 1000);
    });
})(jQuery);

我分享的jQuery代码是有效的，这很好，我没有写代码，我想知道它是如何工作的。

我一直在思考这样一个事实，即有人请求该页面，最近的图像是使用C#在服务器上检索到的，这些图像包含在响应中。创建较新的图像时，它会有一个新的文件名。

jQuery如何为客户端不知道的文件名刷新照片？

特别是这部分代码让我感到困惑：

$.get('?r=' + Math.random(), function(response) {

这个$.get的url请求是什么？我看到F12工具的网络选项卡显示了新的图像响应，但我不明白如何使用jQuery请求具有不同文件名的图像。

更新

公认的答案是正确的，但我想详细说明。这个jQuery再次请求整个页面。HTML响应包含来自服务器的新图像URL。jQuery用于解析响应，获取最新的图像URL，然后用从响应中解析出的新图像URL更新现有的HTML内容。通过这种方式，尝试只刷新整个页面就不会出现页面闪烁。

无法弄清楚这个jQuery代码是如何工作的

它确实将请求发送到同一页面，Math.random()是为了更容易查看每个请求。当您向?提出请求时，这是同一页。

这个$.get的url请求是什么？

$.get中的第一个参数是一个相对url。这意味着它试图访问的url将类似于www.yourdomain.com/whatever？r=。

"？"表示查询字符串的开始，"r"表示请求变量的开始，等号后面的是查询本身。在这种特殊情况下，查询只是一个随机生成的数字，它被发送到服务器。在没有看到服务器端代码的情况下，文件名似乎是在客户端生成的，并以这种方式发送到服务器，然后可能用于在服务器端命名文件。

$.get('?r=' + Math.random(), function(response) {可以是以下两种东西：

  1. 它更改URL是为了不获取缓存内容
  2. 服务器端是被要求作为虚拟的还是我们不知道的东西

我建议查看每个5''调用的请求和响应标头。

相关文章：