jquery分页

锋利的js前端分页之jQuery

送分小仙女□ 提交于 2019-11-29 06:01:21
原文: 锋利的js前端分页之jQuery 大家在作分页时,多数是在后台返回一个导航条的html字符串,其实在前端用js也很好实现。 调用pager方法,输入参数,会返回一个导航条的html字符串。方法的内部比较简单。 1 /** 2 * pageSize, 每页显示数 3 * pageIndex, 当前页数 4 * pageCount 总页数 5 * url 连接地址 6 * pager(10, 1, 5, 'Index')使用方法示例 7 */ 8 function pager(pageSize, pageIndex, pageCount, url) { 9 var intPage = 7; //数字显示 10 var intBeginPage = 0;//开始的页数 11 var intEndPage = 0;//结束的页数 12 var intCrossPage = parseInt(intPage / 2); //显示的数字 13 14 var strPage = "<div class='fr'><span class='pageinfo'>第 <font color='#FF0000'>" + pageIndex + "/" + pageCount + "</font> 页 每页 <font color='#FF0000'>" + pageSize + "</font>

jQuery之编写插件

放肆的年华 提交于 2019-11-27 03:18:43
一、学习插件编写背景 作为一名前端人员,应该注重前端复用性及组件化,更应该考虑前端的性能优化,做到代码简洁有序,不冗余。特别是在大型团队中,如果一个团队中存在多个功能相似的组件,举个栗子,拿分页组件举例,某一个项目系统中使用这个项目下人员编写的一个分页组件,另一个项目系统中使用另一个项目下人员编写的一个分页组件,诸如此类,还有很多个项目系统也是如此,那么将造成团队内部组件冗余不清晰。每个新接手一个项目系统的人员都得熟悉特定的这个项目系统下的诸如分页组件的其他组件,等熟悉之后才能更好地进行项目需求开发。这也正是每个公司想要封装属于自己内部的一套组件库的原因。 二、学习历程 1. 学习封装组件的几种普遍方法及思维 通过JavaScript面向对象的思想,prototype属性(这种属性是比较普遍的) 通过$.fn.pluginName方式(通过jQuery来扩展插件) 2.学习方式 找自己感兴趣的插件来学习,下载其源码,学习如何编写一个组件。之前在看React的combineReducer方法的源码的时候,其实React的思想已经很完备了,combineReducer这个方法就是将多个reducer分别处理不同的action,然后将不同action处理后的state合并成一个最新的state返回。感受最深的是,combineReducer这个方法对于接收参数的验证处理,考虑到了各种情况

锋利的js前端分页之jQuery

雨燕双飞 提交于 2019-11-26 15:45:14
大家在作分页时,多数是在后台返回一个导航条的html字符串,其实在前端用js也很好实现。 调用pager方法,输入参数,会返回一个导航条的html字符串。方法的内部比较简单。 1 /** 2 * pageSize, 每页显示数 3 * pageIndex, 当前页数 4 * pageCount 总页数 5 * url 连接地址 6 * pager(10, 1, 5, 'Index')使用方法示例 7 */ 8 function pager(pageSize, pageIndex, pageCount, url) { 9 var intPage = 7; //数字显示 10 var intBeginPage = 0;//开始的页数 11 var intEndPage = 0;//结束的页数 12 var intCrossPage = parseInt(intPage / 2); //显示的数字 13 14 var strPage = "<div class='fr'><span class='pageinfo'>第 <font color='#FF0000'>" + pageIndex + "/" + pageCount + "</font> 页 每页 <font color='#FF0000'>" + pageSize + "</font> 条</span>"; 15 16 if