Question

所以我在我的网站上有一个“显示最近的”图片div，我想每隔20秒刷新一次内容，以显示新图片。问题是我当前的ajax调用会立即刷新，而不是在20秒后刷新它不会删除以前的数据，所以它会列出所有1000多张图片。

这是我的ajax电话：

$(window).load(function(){
    var timer = 0;
    for (x =0; x<=20; x++)
    {
        timer++;
        if(timer == 20 || x == 20)
        {
            //create XMLHttpRequest object
            xmlHttpRequest = (window.XMLHttpRequest) ?
                new XMLHttpRequest() : new ActiveXObject("Msxml2.XMLHTTP");

            //If the browser doesn't support Ajax, exit now
            if (xmlHttpRequest == null)
                return;

            //Initiate the XMLHttpRequest object
            xmlHttpRequest.open("GET", "../php/rotalas.php", true);

            //Setup the callback function
            xmlHttpRequest.onreadystatechange = updt_pictures;

            //Send the Ajax request to the server with the GET data
            xmlHttpRequest.send(null);
        }
        function updt_pictures()
        {
            if(xmlHttpRequest.readyState == 4)
            {
                document.getElementById('friss_kepek').innerHTML = xmlHttpRequest.responseText;
            }
        }
    }

这里是名为php的列出新文件的文件

<?php
$timer = 0;
for($x = 0; $x < 20; $x++)
{
    if($timer == 20 OR $x==20)
    {
        $timer = 0;
        $x= 0;
    }
}

$x = 1;
while($x >=$timer)
{
$imgdir = '../img/blog/img/amator/Amator_thumb/'; //Pick your folder .. images

$i=0;

$dimg = opendir($imgdir);//Open directory
while($imgfile = readdir($dimg))
{
    if( in_array(strtolower(substr($imgfile,-3)),$allowed_types) OR
        in_array(strtolower(substr($imgfile,-4)),$allowed_types) )
        /*If the file is an image add it to the array*/
    {$a_img[] = $imgfile;}
    if ($imgfile != "." && $imgfile!="..")
    {
        $imgarray[$i]=$imgfile;
        $i++;
    }

closedir($imgdir);

$totimg = count($a_img);  //The total count of all the images .. img_coun

for($x=$page*1; $x < $totimg && $x < ($page+1)*1; $x++){
    $rand=rand(0,count($imgarray)-1);
    if($rand >= 0)
    {
        echo '<img class="kep_listaz" src="../img/blog/img/amator/Amator_thumb/'.$imgarray[$rand].'" width="160" height="140">';
    }}

我试图在循环结束时使用sleep（20），但它根本没有刷新。

谢谢！

Answer 1

Javascript不会每秒运行一次“++”运算符 - 它会运行二十次，非常快。您应该使用setInterval函数来使js仅每20秒调用一次：

http://www.w3schools.com/jsref/met_win_setinterval.asp

更改你的JS（未经测试!!!）：

$(window).load(function(){
    setInterval(function(){
        //create XMLHttpRequest object
        xmlHttpRequest = (window.XMLHttpRequest) ?
            new XMLHttpRequest() : new ActiveXObject("Msxml2.XMLHTTP");

        //If the browser doesn't support Ajax, exit now
        if (xmlHttpRequest == null)
            return;

        //Initiate the XMLHttpRequest object
        xmlHttpRequest.open("GET", "../php/rotalas.php", true);

        //Setup the callback function
        xmlHttpRequest.onreadystatechange = function(){
            if(xmlHttpRequest.readyState == 4){
                document.getElementById('friss_kepek').innerHTML = xmlHttpRequest.responseText;
            }
        };

        //Send the Ajax request to the server with the GET data
        xmlHttpRequest.send(null);
    }, 20000); //Run every 20000ms
}

编辑：你的PHP应该是这样的：

$imgdir = '../img/blog/img/amator/Amator_thumb/'; 

$i=0;

$dimg = opendir($imgdir);//Open directory
while($imgfile = readdir($dimg))
{
    if( in_array(strtolower(substr($imgfile,-3)),$allowed_types) OR
        in_array(strtolower(substr($imgfile,-4)),$allowed_types) )
        /*If the file is an image add it to the array*/
    {$a_img[] = $imgfile;}
    if ($imgfile != "." && $imgfile!="..")
    {
        $imgarray[$i]=$imgfile;
        $i++;
    }
}
closedir($imgdir);

$totimg = count($a_img);  //The total count of all the images .. img_coun

for($x=$page*1; $x < $totimg && $x < ($page+1)*1; $x++){
    $rand=rand(0,count($imgarray)-1);
    if($rand >= 0)
    {
        echo '<img class="kep_listaz" src="../img/blog/img/amator/Amator_thumb/'.$imgarray[$rand].'" width="160" height="140">';
    }
}

我根本没有对此进行测试，但总体思路应该存在。 javascript使用setInterval每20秒进行一次AJAX调用，然后PHP立即响应一些图像。由你决定如何获得你想要的图像。

要消除这一点的是：不要使用for循环进行计时！这就是所谓的CPU限制，这是不应该做的事，除非你真的真的知道你的'做的。

祝你好运！

Answer 2

正如Erty所说，你的代码运行速度非常快20倍，因此它基本上会一次发送20个请求。如果你可以设置超时为20秒的递归函数。

例如：

function updatePic(counter){
  setTimeout(function(){
    //do ajax call and you can use counter to determine what picture to return
    updatePic(counter++);
  }, 20000);
}

PHP方面不需要任何与计时器相关的东西。请注意，您可以在setTimeout（）之外或之内运行ajax调用 - 取决于您在第一个循环中要执行的操作（调用函数然后在进行ajax调用之前等待20秒，或者每20秒进行一次ajax调用，当你调用这个函数时，第一个就会立即发生。）

更好的选择是使用javascript / jquery的幻灯片插件。有很多选择，我最喜欢的是cycle。

PHP删除以前的循环数据

2 个答案: