写在前面 说来也很巧, 下午再做一个页面,再普通不过的分页列表,我还是像往常一样,基于MVC环境下,我正常用PagedList.MVC AJAX做无刷新分页,这时候问题就来了,列表数据中有个轮播图用到了slides.js插件,轮播图也用到了分页 ...
写在前面
说来也很巧, 下午再做一个页面,再普通不过的分页列表,我还是像往常一样,基于MVC环境下,我正常用PagedList.MVC AJAX做无刷新分页,这时候问题就来了,列表数据中有个轮播图用到了slides.js插件,轮播图也用到了分页,数据第一页轮播图页码能正常使用,数据列表翻到第二页则轮播图的页码就无法正常使用,实际上PagedList.MVC自带的样式文件已经和slides.j自带的样式文件冲突,我还特意修改了slides.js的样式文件,然并无卵用,让郁闷飞一会。。。
1、基于MVC PagedList.MVC的分页写法
var currentPage = 1; $(function () { //工具栏绑定页码 currentPage = $('.pagination li.active').text(); currentPage = $('.pagination li.active').text(); $('body').on('click', '.pagination li:not(".active")', function (e) { var txtnum = $(this).text(); if (parseInt(txtnum) > 0) { DoSearch(txtnum); } else if (txtnum == '»') { DoSearch(parseInt(currentPage) + 1); } else if (txtnum == '«') { DoSearch(parseInt(currentPage) - 1); } else if (txtnum == '««') { DoSearch(1); } else if (txtnum == '»»') { var pagenum = $(this).find('a').attr("href").replace(/[^\d]+/gi, ''); DoSearch(pagenum); } return false; }); });//列表复合查询条件 function DoSearch(page) { var item = {}; if (page) { item.pageIndex = page; } PostData(item); }//重点就是这个方法,用于AJAX分页效果,主要是利用页面携带的数据来循环替换function PostData(objdata) { $.post('/Home/Index?rdm=' + Math.random(), objdata, function (d) { //1、替换页面内列表数据 $(".contentajax").html($(d).find(".contentajax").html()); //2、替换页码 $(".ajaxpage").html($(d).find(".ajaxpage").html()); currentPage = $('.pagination li.active', $(d)).text(); }); }
原标题:有了jsRender,妈妈再也不用担心我用jq拼接DOM拼接的一团糟了、页面整齐了、其他伙伴读代码也不那么费劲了
关键词:JS
*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们:
admin#shaoqun.com
(#换成@)。