swiper 解决动态加载数据滑动失效的问题
2018-02-26 15:51
1601 查看
两种解决方法
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 ='<div class="noCollect">' + resultdata.msg + '</div>'; }else{ for(var i in dataList){ var data = dataList[i]; html += '<div class="swiper-container artistDiv">' + '<div class="swiper-wrapper">' + '<div class="swiper-slide workDiv">' + '<div class="app_inlineBlock workPic">' + '<img class="picImg" src="'+ data.artistAvatar +'" />' + '</div>'+'<div class="app_inlineBlock workInfo">' + '<div class="artistName">' + data.artistName + '</div>' + '<div class="workName">' + data.artworkName + '</div>' + '<div class="workValue">'+ data.typeName +'/'+ data.width + '*' + data.height +'/' +data.createYear + '</div>' + '</div><div class="app_inlineBlockRight workPrice">' + '<div class="price">¥'+ data.marketPrice +'</div></div></div>' + '<div class="swiper-slide delBtn">删除</div></div></div>'; } } $("#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 解决动态加载数据滑动失效
- 解决swiper动态数据加载在移动端下左右滑动不好使?
- ajax动态加载swiper,滑动问题解决
- 解决swiper动态数据加载在移动端下左右滑动不好使?
- swiper动态加载数据轮播滑动异常问题
- 使用jquery的load方法设计动态加载,并解决被加载页面JavaScript失效问题
- Swiper 动态加载数据没有变化问题
- 使用jquery的load方法设计动态加载,并解决被加载页面JavaScript失效问题
- 解决chosen-select动态加载数据不生效的问题
- adapter动态更新数据后滑动出现数据错乱问题解决方案
- listview中使用checkbox滑动或者加载更多数据错乱问题解决方案
- spring 返回 JSON乱码问题的解决 及个人 动态加载ztree树结构的json数据代码
- EasyUI的treegrid组件动态加载数据问题解决办法
- 使用jQuery的load方法设计动态加载及解决被加载页面js失效问题
- 在Vue中使用了Swiper ,动态从后台获取数据的之后,swiper滑动失效
- 总结Asp.net中Page加载PostData的具体过程 进而解决"获取动态创建的控件的PostData数据"问题
- Recyclerview列表,item嵌套横向Gridview 解决滑动冲突,数据加载问题
- EasyUI的treegrid组件动态加载数据问题的解决办法-jquery
- EasyUI的treegrid组件动态加载数据问题的解决办法