задержка между каждым foreach javascript / php - PullRequest
Новая
       6

задержка между каждым foreach javascript / php

3 голосов
/ 29 мая 2011

У меня есть функция, которая получает людей из базы данных, а затем, в jquery, просматривает их, анимируя их. Проблема ... которую я вижу довольно распространенной, заключается в том, что javascript запускает все элементы за доли секунды, и задержка будет применяться ко всем. У меня есть поиск по стеку и я нашел несколько ссылок на это, но ни один из них не работает с моим кодом ниже. Любые идеи будут с благодарностью. 

$individuals = $wpdb->get_results("SELECT * FROM wp_sisanda_individualsponsors");

?>

<script type="text/javascript">
function individual_sponsors() {
    var individuals = <?php echo json_encode($individuals) ?>;
    individuals.sort(function() { return 0.5 - Math.random() });
    jQuery.each(individuals, function (i, elem) {
        var topRand = Math.floor(Math.random()*301);
        var leftRand = Math.floor(Math.random()*301);
        var startLeftRand = Math.floor(Math.random()*301);
        jQuery('.individuals').append('<div id="'+ elem.id + '" class="indiv" style="position: absolute; bottom: -70px; left:' +  startLeftRand +'px;">' + elem.name + '</div>');
        jQuery('#' + elem.id).animate({
            top: -100,
            left: Math.floor(Math.random()*301)
        },20000 + Math.floor(Math.random()*50000));
    });
    }
</script>

Как вы можете видеть, предметы получают случайную горизонтальную начальную позицию и конечную позицию, а также случайную скорость, это хорошо работает, за исключением того, что все еще существует большая группа предметов.

Я попытался ограничить первоначально запрашиваемую сумму - случайно выбрал несколько, а затем несколько раз вызывал функцию с ожиданием php, но это, я думаю, вызвало цикл ifinite ... не уверен ... страница была т погрузка.

Я надеюсь, что кто-то может указать мне правильное направление

В идеале это оживило бы нескольких ... подожди ... а потом сделай еще ...

Заранее спасибо

1 Ответ

1 голос
/ 29 мая 2011

Ожидание PHP не поможет вам, так как PHP выполняется на сервере до того, как что-либо будет отправлено клиенту (где выполняется JavaScript).Если вы хотите оживить несколько, подождите немного, затем оживите еще немного, пока не закончите, тогда вы можете использовать setTimeout: 

var current = 0;
function animateSome() {
    // Animate a few (starting at individuals[current]) and
    // update current with the array index where you stopped.
    // ...

    // If there's anything left to do, start a timer to animate
    // the next chunk of individuals.
    if(current < individuals.length)
        setTimeout(animateSome, 250);
}
animateSome();
...