图像加载时间延迟

Question

该脚本有效，并加载到我的图像中。

我希望在10秒钟后将其加载到新图像中，当我尝试执行此操作时，对我做错了什么没有任何建议？

    <?php header("Refresh: 5; URL=mytestfile.php"); ?>
<div style="width: 964px;">
<div style="float: left; width: 240px;">
<?php $mybanners[1] = '<a href="/chiropractor/"><img src="banners/chiropractor.jpg"></a>';
$mybanners[2] = '<a href="/chiropodist/"><img src="banners/chiropody.jpg"></a>';
$mybanners[3] = '<a href="/fitness-instructor/"><img src="banners/fitness ball.jpg"></a>';
$mybanners[4] = '<a href="/dietician/"><img src="banners/Dietician.jpg"></a>';
$mybanners[5] = '<a href="/alexander-technique/"><img src="banners/Alexander technique.jpg"></a>';

$id = rand(1,5);

echo $mybanners[$id]; 

// this is the section I tried to control the delay

$mybanners = 0;
for($i=0; $i<10000; $i++){
if($i=='10000'){
    $mybanners++;
    $i = 0;
    }
    if($mybanners=='10'){
    $mybanners=0;
 }

}?>

Answer 1

您无法通过PHP进行控制，这是Javascript用例。 for不是与时间相关的控件： http : //php.net/manual/en/control-structures.for.php

您可以使用Javascript获得图像列表：

var myImages = [
  '<a href="/chiropractor/"><img src="banners/chiropractor.jpg"></a>',
  '<a href="/chiropractor/"><img src="banners/chiropractor.jpg"></a>',
  '<a href="/chiropractor/"><img src="banners/chiropractor.jpg"></a>',
  '<a href="/chiropractor/"><img src="banners/chiropractor.jpg"></a>',
];

（您当然可以使用PHP生成此列表）

然后，每10秒对它执行以下操作：

var i = 0;
window.setInterval(function() {
  alert(myImages[i]);
  i++;
, 10000}

PHP如果用于生成页面，则在将页面提供给客户端之后无能为力。

Answer 2

如果您尝试使用“刷新”标头进行循环，则不需要循环。
同样，计数到10000不需要10秒。 并且您将以前的urls数组用作索引...简而言之，再次构建它。

如果要在浏览器中旋转网址列表，请使用javascript。

编辑：添加示例

1）使url可用于javascript：

在php中，您输出javascript：

echo "<script>";
echo "var urlList = new Array();";
foreach ($urls as $url)
  echo "urlList[urlList.length]='$url';";

2）旋转它们这是每5秒运行一次功能的基本结构：

setTimeout(function() {}, 5000);

您需要找出一种进行旋转的方法：为该数组的索引保留一个计数器，或者尝试使用随机数：

setTimeout(function() {
  var index = Math.round(Math.rand * urlList.length);
  document.getElementById('#myimg').src.href=urlList[index];
}, 5000);

注意：我在这里编写此代码，它未经测试，但足以使您开始工作。 完成后，请考虑使用一些jQuery.fade过渡。