用javascript刷新所有图像？

Question

I am trying to load the latest image from a CCTV server for each of our cameras on our network. 我正在尝试从CCTV服务器为网络上的每个摄像机加载最新图像。

I have the following code, which works correctly and refreshes the image constantly. 我有以下代码，它们可以正常工作并不断刷新图像。 However, on the final version of the page there will be around 10 camera images on the page. 但是，在页面的最终版本上，页面上将有大约10张相机图像。 I was wondering if the code I have now could be altered to refresh all images - not just specific ones. 我想知道我现在拥有的代码是否可以更改为刷新所有图像，而不仅仅是特定的图像。

At first I thought I could just use the same identifier for each image, but then I realised that the source of each image differs. 起初，我以为每个图像都可以使用相同的标识符，但是后来我意识到每个图像的来源都不同。

<html>
<head>
 <title>CCTV Test</title>
 <script type="text/javascript" language="JavaScript">
    newImage = new Image();

    function LoadNewImage()
    {
        var unique = new Date();
        document.images.ward.src = newImage.src;
        newImage.src = "http://192.168.1.64/image/WARD?time=" + unique.getTime();
    }

    function InitialImage()
    {
        var unique = new Date();
        newImage.onload = LoadNewImage;
        newImage.src = "http://192.168.1.64/image/WARD?time=" + unique.getTime();
        document.images.ward.onload="";
    }
 </script>
</head>
<body>
<img src="http://192.168.1.64/image/WARD" name="ward" onload="InitialImage()">
</body>
</html>

Any pointers would be appreciated! 任何指针将不胜感激！

Answer 1

Something along the lines of this: 与此类似：

<!DOCTYPE html>
<html>
<head>
  <title>CCTV Test</title>
</head>
<body>
  <img src="http://192.168.1.64/image/WARD?time=...">
  <img src="http://192.168.1.64/image/WARD?time=...">
  etc.
  <script>
  setInterval(function() {
      var images = document.images;
      for (var i=0; i<images.length; i++) {
          images[i].src = images[i].src.replace(/\btime=[^&]*/, 'time=' + new Date().getTime());
      }
  }, 10000); // 10000 milliseconds = 10 seconds
  </script>
</body>
</html>

This will refresh all images every 10 seconds. 这将每10秒刷新一次所有图像。

A different approach is to store the locations of the images in an array. 另一种方法是将图像的位置存储在阵列中。

用javascript刷新所有图像？

问题描述

1 个解决方案

解决方案1
4 已采纳 2012-09-04 09:04:55

用javascript刷新所有图像？

问题描述

1 个解决方案

解决方案1 4 已采纳 2012-09-04 09:04:55

解决方案1
4 已采纳 2012-09-04 09:04:55