为什么图片不会自动刷新

Question

尝试让图像使用 javascript 刷新一定次数，然后停止（以避免生成大量缓存）。这段代码不起作用，所以不确定缺少什么？

<script>
var c = 0;
function fnSetTimer()
{
document.getElementById('refreshimage1').src='http://68.116.42.142:8080/cam_4.jpg?\'+new Date().getMilliseconds();
var t = setTimeout(fnSetTimer,5000);
c=c+1; 
if(c>5) 
clearTimeout(t); 
} 
</script>
<img src="http://68.116.42.142:8080/cam_4.jpg"; id="refreshimage1" onload="fnSetTimer()" width="400" /> 

但是，这段代码确实有效：

<img src="http://68.116.42.142:8080/cam_4.jpg"; id="refreshimage2" onload="setTimeout('document.getElementById(\'refreshimage2\').src=\'http://68.116.42.142:8080/cam_4.jpg?\'+new Date().getMilliseconds()', 5000)" width="400" />

因此，如果您将两者并排放置，则底部图像会（无限期地）刷新，但顶部图像只会加载一次并且永远不会刷新。有什么想法是我在顶部代码中遗漏的吗？

Answer 1

问题是函数重新加载图片，调用函数，重新加载图片...

图片网址也有问题 - '\' 用于转义特殊字符，如果你想要一个斜线，你需要两个 - '\\'

把它放在你的标题中

<script language="javascript">

function fnSetTimer(image, src, counter, limit)
{
    image.onload = null;

    if(counter < limit)
    {
        counter++;
        setTimeout(function(){ fnSetTimer(image, src, counter, limit); },5000);
        image.src= src+ '?\\'+new Date().getMilliseconds();
        alert(counter); // show frame number
    }
} 
</script>

把它放进身体里

<img src="http://68.116.42.142:8080/cam_4.jpg"; id="refreshimage1" onload="fnSetTimer(this, this.src, 0, 5);" width="400" /> 

这应该会为您解决这个问题 - 它只会触发一次 onLoad，然后循环 5 次，您应该能够在 Wordpress 等中编辑图像标签。

确保为每张图片提供不同的 ID