有需求是按照类别标签，进行分类显示，并且下拉加载，使用的是dropload.js插件，实现效果如下
（在页面分别点击标签按钮，实现下边内容的更新，并且，下方内容页面要有下拉加载效果）
实现方式：
一：思路：将dropload的下拉加载放入点击标签事件函数内，并且每次点击函数内一开始都初始化页码page、清除原页面内容；为了解决初始进来不加载问题，可将标签点击事件函数放入自动加载函数中
二：代码：
（页面内容）
( 页面进来自动触发)
1 function allComment(column_id) { 2 var iColumnId = column_id; 3 $("#comment_list").empty(); 4 $(‘#morelist‘).empty(); 5 var iPage = 1; 6 dropload = $(‘.myComment-list‘).dropload({ 7 scrollArea: window, 8 domDown: { 9 domClass: ‘dropload-down‘, 10 domRefresh: ‘<div class="dropload-refresh">↑上拉加载更多</div>‘, 11 domLoad: ‘<div class="dropload-load"><span class="loading"></span>加载中...</div>‘, 12 domNoData: ‘<div class="dropload-noData">暂无数据</div>‘ 13 }, 14 loadDownFn: function (me) { 15 $.ajax({ 16 type: ‘GET‘, 17 url: "{{ route(‘front.personal.comment‘) }}?iPage=" + iPage + ‘&iColumnId=‘ + iColumnId, 18 dataType: ‘json‘, 19 success: function (res) { 20 if (res.data.data_flag) { 21 $(‘#morelist‘).append(res.data.sHtml); 22 } else { 23 me.lock(); 24 // 无数据 25 me.noData(); 26 } 27 console.log(iPage); 28 iPage++; 29 // 每次数据加载完，必须重置 30 dropload.resetload(); 31 }, 32 error: function (xhr, type) { 33 alert(‘loadDownFn error!‘); 34 // 即使加载出错，也得重置 35 dropload.resetload(); 36 } 37 }); 38 } 39 }); 40 }
理解：
（1）每次点击标签，都会初始化一次（代码3,4,5行），然后执行dropload的下拉加载行为，ajax中，将页码和标签id传到控制器，进行数据搜索，搜索完毕给到小页面，将小页面html返回此处，
（2）20行，res.data.data_flag是一个布尔值，是控制器的判断某页数据是否还有的一个判断；
（3）每次传值page=1,成功后，将page++,即为第二页
（4）页面加载内容div,要放到dropload的引用div上边,要不“暂无数据”这种提示会显示在页面头部
原文：https://www.cnblogs.com/zuozuo-zgf/p/11905552.html