引导分页器是一款基于引导程序的射流研究…分页插件,功能很丰富,个人觉得这款插件已经无可挑剔了。它提供了一系列的参数用来支持用户的定制,提供了公共的方法可随时获得插件状态的改变,以及事件来监听用户的动作。目前经过测试的浏览器包括:火狐5、Chrome 14、Safari 5、Opera 11.6和IE 7。
官网地址:http://引导程序。组织/
下载访问开源代码库中的项目
使用这个插件和使用其他引导程序内置的插件一样,需要引入如下文件:
链接href=' CSS/bootstrap。CSS ' rel='样式表脚本类型=' text/JavaScript ' src=' http : js/jquery-1。8 .1 .js '/script脚本类型=' text/JavaScript ' src=' http : js/bootstrap-paginator。js '/脚本
使用实例:
jsp代码
div class=' padlr ' align=' right ' ul id=' data-pagining ' class=' pagining ' Li class=' disabled ' a href=' # '/a/Lili class=' active ' a href=' # ' 1/a/Lilia href=' # ' 2/a/Lilia href=' # ' 3/a/Lilia href=' # ' 4/a/Lilia href=' # ' 5/a/Lilia href=' # '/a/Li/ul/div js代码
var页码=1;var pageSiza=10函数getData() {$ .post('url ',{dataId : dataId,currentPage:页码,pageSize :页面大小},函数(数据){ if(数据。totalrow 0){ var options={当前页面:数据。页码,//变量名必须为currentPagetotalPages :数据。totalpages,//变量名必须为totalpagesssajaxooption : { URL : ' URL ',pageSize: pageSize,dataId : dataId,appendelements : ' data-list ',templateId: 'tpl-data-list ',otherParams: { },}$('#data-pagination ').自举者(选项);var html=模板(“第三方物流-数据-列表”,数据);$(' #数据列表').html(html);} else {$('#data-list ').html(" ");}});} $(' # data-paging ').引导想象程序(选项)就是将编号为"数据分页"的数字正射影像图元素设置为分页组件,同时传入一些定制参数,当前页面设置当前页码,totalPages设置总页数。
以上所述是小编给大家介绍的引导程序分页插件之引导分页器实例详解,希望对大家有所帮助,如果大家有任何疑问欢迎给我留言,小编会及时回复大家的,在此也非常感谢大家对我们网站的支持!