Question

我的代码每x秒更换一次照片。我的jQuery代码：

＆＃13;

setInterval("rotator();",4000);                        

function rotator(){
  var i = 0;
  var zdjecie = '';
  $('#rotate').html('');
    while(i<4){
        $.post('http://patwoj.hekko24.pl/rotator/content.php', function(data){
                       var wstaw='<li  style="display:inline"><a href="images/'+data+'" class="highslide" title="" onclick="return hs.expand(this, config1 )"><img src="images/'+data+'"  alt=""/> </a></li>';
                       $('#rotate').append(wstaw);
                       return data;
        });
        i++; 
    }
}

＆＃13;

<ul id="rotate">
	<li  style="display:inline" id="rot1">
	<a href="highslide/images/large/dyplom.jpg" class="highslide" 
			title="" 
			onclick="return hs.expand(this, config1 )">
		<img src="http://www.akwarystyka-miedziowa.pl/highslide/images/thumbs/dyplom.jpg"  alt=""/>
	</a>
	</li>
	<li  style="display:inline" id="rot2">
	<a href="highslide/images/large/akw1.jpg" class="highslide" 
			title="" 
			onclick="return hs.expand(this, config1 )">
		<img src="http://www.akwarystyka-miedziowa.pl/highslide/images/thumbs/akw1.jpg"  alt=""/>
	</a>
	</li>
	<li  style="display:inline" id="rot3">
	<a href="highslide/images/large/akw2.jpg" class="highslide" 
			title="" 
			onclick="return hs.expand(this, config1 )">
		<img src="http://www.akwarystyka-miedziowa.pl/highslide/images/thumbs/akw2.jpg"  alt=""/>
	</a>
	</li>

	<li  style="display:inline" id="rot4">
	<a href="highslide/images/large/okon.jpg" class="highslide" 
			title="" 
			onclick="return hs.expand(this, config1 )">
		<img src="http://www.akwarystyka-miedziowa.pl/highslide/images/thumbs/okon.jpg"  alt=""/>
	</a>
	</li>

	</ul>

＆＃13;

我的PHP代码

<?php
 $dir = 'images/';
 $files = scandir($dir);
 unset($files[0]);
 unset($files[1]); 
 $max = max(array_keys($files));
 $los = rand(2,$max);
 print_r($files[$los]);

＆GT;

记录不是唯一的（有时它显示2个相同的图像）。是否有可能改变它？

这是我的网站： http://patwoj.hekko24.pl/rotator/

Answer 1

您最好在服务器中控制图像的随机性，并在一次ajax调用中将所有4个图像全部化：

setInterval("rotator();",4000);                        

function rotator() {
  $('#rotate').html('');
  $.post('http://patwoj.hekko24.pl/rotator/content.php', function(data){
    for(i=0;i<data.length;i++) {
      var wstaw='<li  style="display:inline"><a href="images/'+data[i]+'" class="highslide" title="" onclick="return hs.expand(this, config1 )"><img src="images/'+data[i]+'"  alt=""/> </a></li>';
      $('#rotate').append(wstaw);
    }
  });
}

您的content.php：

<?php
 $dir = 'images/';
 $files = scandir($dir);
 unset($files[0]);
 unset($files[1]); 
 $rand_imgs_json = json_encode(array_rand($files, 4));
 header("Content-type: application/json");
 echo $rand_imgs_json;
?>

Answer 2

对于images目录中的每个文件名，您应该存储上次显示时间的time（）时间戳。

然后，对于每个请求，请保存具有最旧时间戳的那些请求。把它们拿出来，然后立刻就需要，随机选择那些展示。存储所选文件的时间（）时间戳，显示它们。完成。

每次都会显示不同的文件，并且不会重复显示。

PS：您可以通过多种方式存储时间戳，但如果您已将此数据库连接用于此网站的其他原因 - 您最好选择具有2个字段的数据库表 - filename varchar UNIQUE，tm时间戳索引。然后只需要通过tm DESC LIMIT请求数据库订购数据，一次需要2x个图像。您还必须正确管理该表的INSERT / UPDATE。

Answer 3

使用类似

的内容

setInterval("rotator();",4000);                        

function rotator(){
  var i = 0;
  var zdjecie = []; // MODIFIED
  $('#rotate').html('');
    while(i<4){
        $.post('http://patwoj.hekko24.pl/rotator/content.php', function(data){

                       // ADDED LINE BELOW
                       if(zdjecie.indexOf(data) < 0) {
                           var wstaw='<li  style="display:inline"><a href="images/'+data+'" class="highslide" title="" onclick="return hs.expand(this, config1 )"><img src="images/'+data+'"  alt=""/> </a></li>';
                           $('#rotate').append(wstaw);
                           zdjecie.push(data);
                           i++;
                        }

        });

    }
}

只有当数据中不存在该数据时，才能将名为zdjecie的数组中收到的数据推送出去。当发生这种情况时，也会增加变量i。因此只有在有可用的唯一数据时才会进行增量。最后，您将只获得唯一数据。

返回唯一索引ajax

3 个答案: