首页 > 代码库 > 分页插件jquery.simplePagination.js使用
分页插件jquery.simplePagination.js使用
利用ecshop后台,利用插件更改分页显示样式遇到的问题,由于是利用Ajax获取数据进行页面数据更新?所以出现了以下情况:
初始化页面前 :
分页更新后:
点击后出现了分页插件内容消失,
原因:分页一栏在AJax更新表格里(而插件写在外面,初始化页面显示),更新数据后,重新填充表格,所以分页插件内容没有被插入进去,因而不显示
调取query更新需要返回的内容,只更新table里的数据内容
解决办法:
把分页插件写在Ajax更新数据外面,或写在里面同时更新
把分页栏 <div >{include file="page_new.htm"}</div> 放到更新table外面
插件使用:
导入css/js文件
<link rel="stylesheet" type="text/css" href="http://www.mamicode.com/js/Pagination/css/css.css" /><link rel="stylesheet" type="text/css" href="http://www.mamicode.com/js/Pagination/css/simplePagination.css" />{insert_scripts files="../js/Pagination/js/jquery.min.js"}{insert_scripts files="../js/Pagination/js/jquery.simplePagination.js"}{insert_scripts files="../js/Pagination/js/index.js"}
调用:
<script style="text/javascript">var page_index;var itemsOnPage = 1;$(function() {$("#light-pagination").pagination({items: {$page_count}, 总页数itemsOnPage: itemsOnPage,cssStyle: ‘light-theme‘,//onInit: changePage, 初始化函数onPageClick: changePage 点击时触发函数
}); });
function changePage(page_index,event){
listTable.gotoPage(page_index); gotoPage函数调用ajax获取数据 填充页面
document.getElementById(‘pageCurrent‘).innerHTML=page_index;
return true;
} </script>
分页插件jquery.simplePagination.js使用
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。