jQuery: setInterval

Question

Я хочу сделать слайд-шоу на моем сайте, но проблема в том, что setInterval работает только один раз.Он загружает мой файл только один раз, а затем останавливается.

Вот код: main.html

<img src="images/ex/full.jpg" width="800" height="377" alt="">
<script>
    $(document).ready(function(){
        var refreshId = setInterval(function(){
            $('#center').load('images/gallery/best/rotate.php');
        }, 5000);
    });
</script>

rotate.php

<img src="images/gallery/best/random.php?".<?php echo rand(0,1000) ?>."" width="800" height="377" alt="">

random.php содержит код, который загружает случайное изображение из выбранной папки, работаетхорошо.

Забыл упомянуть, у меня тоже есть скрипты лайтбокса.Может быть, они не работают вместе?

Руководитель:

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="vendors/jquery/jquery-1.4.4.min.js"></script>
<script type="text/javascript" src="vendors/js/prototype.js"></script>
<script type="text/javascript" src="vendors/js/scriptaculous.js?load=effects,builder"></script>
<script type="text/javascript" src="vendors/js/lightbox.js"></script>
<link rel="stylesheet" href="styles/style.css" type="text/css" />
<link rel="stylesheet" href="styles/lightbox.css" type="text/css" />

Спасибо.

Answer 1

<script>
$(document).ready(function(){
    var refreshId = setInterval(function(){
    var r = (-0.5)+(Math.random()*(1000.99));
        $('#center').load('images/gallery/best/random.php?'+r);
    }, 5000);
});
</script>

Как насчет этого?

-

Редактировать

Извините, я имел в виду, что вы должны просто рандомизировать фотографии в функции setInterval.Как показано выше.Вместо rotate.php;просто загрузите random.php.

Answer 2

Расширяя мой комментарий, если это проблема с кэшированием, вы можете обновить свой код с помощью

<script>
$(document).ready(function(){
    var refreshId = setInterval(function(){
        $('#center').load('images/gallery/best/rotate.php?' + new Date().getTime());
    }, 5000);
});
</script>

Что приведет к тому, что URL будет отличаться при каждом запросе и, следовательно, позволит избежать проблемы с кэшированием.

Answer 3

Там проблема не в setInterval, а в кешировании изображения. Когда тег изображения загружен, он выглядит точно так же, как и раньше. Браузер не загружает изображение снова, он просто использует тот, который уже загружен.

Если вы хотите снова загрузить изображение, измените rotate.php, чтобы включить счетчик или случайное число в качестве параметра в URL, возвращая что-то, например, похожее на это:

<img src="images/gallery/best/random.php?98037465936" width="800" height="377" alt="">

Изменяя URL каждый раз при загрузке тега, браузер должен каждый раз загружать новое изображение.

Answer 4

Проблема, вероятно, в том, что браузер загрузил random.php в кеш.Я думаю, вам лучше дать каждому изображению свой URL и использовать его.Затем на странице php может быть просто src:

var refreshId = setInterval(function () {
  $.get('random-src.php', function (result) {
    $('#center>img').attr('src') = result;
  },'text');
},5000);

. Тогда random.php может произвольно вернуть img/img1.jpg, img/img2.jpg и т. Д.* к началу вашего файла random.php, чтобы предотвратить кеширование браузера.