ssjf
        $$.ajax({
            url:\'http://localhost:8080/api/v1/food/listFeatureFood\',
            type:\'Get\',
            xhrFields: {withCredentials: true},
               crossDomain: true,
               data:{\'foodTakeoutState\':0,\'foodTop\':3},
            success:function(result){
                var length = result.value.length;
                if(length == 1) {
                    console.log(result.value[0].foodImg)
                    $$(\'.topImg\').append(
                        \'<div class="mui-slider-item">\'+
                            \'<a href="#">\'+
                                \'<img src="\'+result.value[0].foodImg+\'">\'+
                            \'</a>\'+
                        \'</div>\'
                        );
                    } else {
                    $$(\'.topImg\').append(
                        //<!-- 额外增加的一个节点(循环轮播:第一个节点是最后一张轮播) -->
                        \'<div class="mui-slider-item mui-slider-item-duplicate">\'+
                            \'<a href="#">\'+
                                \'<img src="\'+result.value[length-1].foodImg+\'" >\'+
                            \'</a>\'+
                        \'</div>\'
                    );
                    $$(\'.topImgActive\').append(
                        \'<div class="mui-indicator mui-active"></div>\'
                    );
                    for(var i = 0; i < length; i++) {
                            $$(".topImg").append(
                            \'<div class="mui-slider-item">\'+
                                \'<a href="#">\'+
                                    \'<img src="\'+result.value[i].foodImg+\'">\'+
                                \'</a>\'+
                            \'</div>\'
                        );
                    }
                    $$(\'.topImg\').append(
                            //<!-- 额外增加的一个节点(循环轮播:最后一个节点是第一张轮播) -->
                            \'<div class="mui-slider-item mui-slider-item-duplicate">\'+
                                \'<a href="#">\'+
                                    \'<img src="\'+result.value[0].foodImg+\'" >\'+
                                \'</a>\'+
                            \'</div>\'
                        );
                    for(var i = 0; i < length - 1; i++) {
                        $$(\'.topImgActive\').append(\'<div class="mui-indicator"></div>\');
                    }
                }    
                //需要重新加载轮播组件   
                //获得slider插件对象
                var gallery = mui(\'.mui-slider\');
                gallery.slider({
                    interval: 5000 //自动轮播周期,若为0则不自动播放,默认为0;
                });    
            }
        });

 

分类:

技术点:

相关文章: