setInterval实现n个div循环自动播放

首先需要引入jQuery，然后开始，获取需要循环的div总个数，然后设置

一个变量用来存要循环div的下标，设置定时器，下标+等于1，如果下标等于div的总个数，下标设置为0，这样就会实现从头开始循环

<script type="text/javascript">
    $(function(){

    //获取需要循环的div总个数
        var sales_num = $('.sichou').children('.sales_index').length;
        //var一个值用来保存要循环的下标
        var index =0;
        //3秒轮播一次
        var timer = setInterval(function(){
    //循环一次加一次
            index += 1;

    //如果下标等于等于div的总个数，下标设置为0，从头开始
            if(index == sales_num){
                index = 0;
            }
            //某个div显示，其他的隐藏
            $(".sales_index").hide().eq(index).show();
        }, 3000);

 $('#botton1').click(function(){
            //点击按钮，停止计时器
//            clearInterval(timer);
            if(index < 1){
                index = 0;
                $(".sales_index").hide(500).eq(index).show(500);
            }else{
                $(".sales_index").hide(500).eq(index).prev().show(500);
            }
            index = index - 1;
        });
        $('#botton2').click(function(){
//            clearInterval(timer);
            if(index < 1){
                index = 0;
            }
            if(index == sales_num - 1){
                index = 0;
                $(".sales_index").hide(500).eq(index).show(500);
            }else{
                $(".sales_index").hide(500).eq(index).next().show(500);
            }
                index = index + 1;
        });

    })
</script

//样式所有的div都隐藏，第一个div显示

<style>

.sales_index{display: none;}
.sales_cur{display: block;}

</style>

//html代码

<volist name="sales" id="vo" key="_k">
    <div class="sales_index <if condition='$_k eq 1'>sales_cur</if>">
        <div class="sales_info"><?php echo msubstr($vo['info'],0,40)?></div>
        <div>{$vo.cname}<br/>
             {$vo.sname}<br/>
             {$vo.stell}<br/>
        </div>
    </div>
</volist>