平武建站

swiper解决动态加载数据滑动失效的问题

两种解决方法

阜宁网站建设公司成都创新互联公司,阜宁网站设计制作，有大型网站制作公司丰富经验。已为阜宁千余家提供企业网站建设服务。企业网站搭建\成都外贸网站建设要多少钱，请找那个售后服务好的阜宁做网站的公司定做！

1、数据加载后进行swiper初始化

success:function(result){
var resultdata =eval("("+result+")");
if(resultdata.status == 1){
	var dataList = resultdata.data;
	currentPage = resultdata.currentPage;
	pageCount = resultdata.pageCount;
	var html = "";
	if(pageCount == 0){
		html ='
' + resultdata.msg + '
';
	}else{
		for(var i in dataList){
			var data = dataList[i];
			html += '
'
			+ '
'
			+ '
'
			+ '
'
			+ ''
			+ '
'+'
'
			+ '
' + data.artistName + '
'
			+ '
' + data.artworkName + '
'
			+ '
'+ data.typeName +'/'+ data.width + '*' + data.height +'/' +data.createYear + '
'
			+ '
'
			+ '
￥'+ data.marketPrice +'
'
			+ '
删除
';
		}
		
	}
	$("#list").append(html);
	//swiper初始化 
	var swiper = new Swiper('.swiper-container', {
		pagination: '.swiper-pagination',
		slidesPerView: 'auto',
		paginationClickable: true,
		spaceBetween: 0
	});
}

2、swiper初始化加两行代码

swiper1 = new Swiper('.swiper-container', { 
 initialSlide :0, 
 observer:true,//修改swiper自己或子元素时，自动初始化swiper 
 observeParents:true//修改swiper的父元素时，自动初始化swiper 
});

以上这篇swiper 解决动态加载数据滑动失效的问题就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持创新互联。


分享名称：swiper解决动态加载数据滑动失效的问题
网页网址：http://pwwzsj.com/article/iigcsc.html

其他资讯