猿问

关于swiper和Ajax滚动的诡异问题?

我把来龙去脉说一遍,

开始静态swiper滚动正常,ajax加载也正常,两个一组和发生第一个问题,那就是swiper无法滚动动态数据

我改为ajax加载之后马上初始化swiper,ok,滚动问题解决了,那么就出现了第二个问题,点击加载更多后局部刷新的时候会弹回页面顶部, $("").append();输出方法无毛病,折腾两天不知道问题出在哪?

下面是代码:

html

        <div class="swiper-wrapper">
          <div class="swiper-slide slidescroll">    
    
       <ul class="img" id="uiList"> 
	    </ul>
	    
	<botton id="pull-up-label"style="">加载更多 </botton>
	<botton id="loading_icon" style="display: none;" >加载中</botton>
	</div>
     </div>

js代码

$(document).ready(function() {

var Class="0";//当前剧情        
var Type=1;//当前分类id        
var;//当前语言        
var Letter="0";//当前头字母 a b c d 
var year="0";//当前年代
var page=1;//当前分页

var refresh_open = true;
//首页数据
$("#pull-up-label").click(function(){
     if(refresh_open){
        refresh_open = false;
        $("botton[id='loading_icon']").css("display","");
        $("#pull-up-label").css("display","none");
         $.ajax({
     url:"index.php/label/json/page/"+page+"/class/"+Class+"/id/"+Type+"/lang/"+Lang+"/letter/"+Letter+"/year/"+year+".html",
        success:function(result){
                   $("botton[id='loading_icon']").css("display","none");
                   $("#pull-up-label").css("display","");          
                    if(result != ""){
                       $("#uiList").append(result);
                     page +=1;
                //内容滚动初始化
              var swiper = new Swiper('.scroll', {  
                 
               slidesOffsetBefore: 72,
                direction: 'vertical',
                freeMode: true,
                slidesPerView: 'auto',
                observer: true,//修改swiper自己或子元素时,自动初始化swiper  
                observeParents: true,//修改swiper的父元素时,自动初始化swiper  
 
            }); 

                   setTimeout(function(){
                       refresh_open = true;
  
                   },2000);
                }else{
                    $("#pull-up-label").html("无更多内容!");
                    $("#pull-up-label").attr("disabled","");
                };
    
           }});



         }
});

$("#pull-up-label").trigger("click");

});



愤怒de小菜鸟
浏览 2050回答 0
0回答
随时随地看视频慕课网APP
我要回答