循环定时jquery函数的最佳实践是什么?

时间:2013-11-22 13:55:26

标签: jquery loops timing

当我使用jQuery进行循环时,我真的很困惑如何传递值并重新开始。

我的项目是一个“简单”的见证旋转器。

<div id="testimonials">
    <div class="testimonial">
        <p>You're great!</p>
    </div>
    <div class="testimonial">
        <p>Thanks a lot!</p>
    </div>
    <div class="testimonial">
        <p>Rock on!</p>
    </div>
</div>
<script>
    jQuery(function ($) {
        $( document ).ready(function() {
            function fade() {
                $('.testimonial').hide();
                var t = $('.testimonial').length;
                alert(t);
                for( var i = 1; i <= t; i++){
                    function slideit(){
                       var i = i;
                       $('.testimonial.nth-child(' + i + ')').show('slow');
                       $('.testimonial.nth-child(' + i + ')').hide('slow').delay(2000);
                    }
                    slideit();
                }
            }
            fade();
        });
    });
</script>

现在,我被困住了。指针越过驼峰?

2 个答案:

答案 0 :(得分:1)

最好的方法是使用setInterval()

var i = 0, // index of element to show
    t = $('.testimonial'), // elements
    max = t.length; // max elements
function fade() {
    t.eq(i).show('slow'); // we show current element
    t.not(':eq('+i+')').hide('slow'); // we hide others
    if(++i >= max) i=0; // we increment index and if we go over max, we reset index
}
window.setInterval(fade,3000); // we call fade every 3 seconds

http://jsfiddle.net/zf5Wb/

答案 1 :(得分:0)

正如Shikiryu所说。

将代码从

$('.testimonial.nth-child[' + i + ']')
更改为
$('.testimonial:nth-child(' + i + ')')