0

所以我在我的网站上有一个“显示最近的”图片 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)，但它根本没有刷新。

谢谢！

4

2 回答 2

1

正如 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 的幻灯片插件。有很多选择，我最喜欢的是循环。

于 2012-07-12T23:51:16.383 回答
1

Javascript 不会每秒运行一次“++”运算符 - 它会运行 20 次，非常快。您应该使用 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 限制，除非你真的知道自己在做什么，否则不应该这样做。

祝你好运！

于 2012-07-12T23:40:29.417 回答