前端分页插件pagination

摘要:

最近在开发项目中又用到了前端分页,以前也做过,为了方便以后使用所以将他封装成第三方插件,不依赖任何库。网上已经有很多插件,问什么还要自己造轮子?

  1. 自己写的扩展性高
  2. 不依赖任何库
  3. 作为一次技术沉淀

在线预览:http://baixuexiyang.github.io/pagination/

项目地址:https://github.com/baixuexiyang/pagination

注意:

后面我还要将自己在开发中写到的插件都总结下分享给大家,如果你喜欢用可以star或者fork,或者你有什么问题可以提issue。

时间: 2024-10-10 05:02:55

前端分页插件pagination的相关文章

Ajax分页插件Pagination从前台jQuery到后端java总结

前端代码.html var pageSize = 10;//设置每页显示条数 var total;//数据总条数 function pagination() { $("#Pagination").pagination(total, { callback : PageCallback, prev_text : '上一页', next_text : '下一页', items_per_page : pageSize, num_display_entries : 4, //连续分页主体部分显示

jq的分页插件(pagination.min.js)

首先引入jq,再引pagination.min.js和pagination.css html: <div id="pagingmix" class="page m-style M-box3"> </div> js: function laodPage(pages,alen){ $(".M-box3").whjPaging({ totalSize: alen, totalPage: pages, callBack: func

angularJS前端分页插件

首先在项目中引入 分页插件的 js 和 css: 在html页面引入 相关js 和 css: 在控制器中引入分页插件中定义的 module[可以打开pagination.js查看,可以看到 其实,在插件里面,它定义了一个单独的 module,所以我们在控制器中使用分页插件时,要先注入 这个 module ] 然后我们就可以在想要出现分页控件的位置,加上一个标签: 加上这个标签,就会在这里出现分页,注意,它有个属性 conf 这里定义的名字是 paginationConf,这个属性是个对象,它可以

好用的前端分页插件

在网上找了好久分页插件,终于找到个满意的,顺便重新封装一下. 只需在 html界面加入如下div 即可 其中id为固定 <div id='page' url='helloword.html'></div> 应用时只需更改fenye.js文件的 count start 值即可 效果图 如下 下载插件连接 http://files.cnblogs.com/files/changhai/%E5%88%86%E9%A1%B5%E6%8F%92%E4%BB%B6.zip

前端分页插件bootstrapPaginator的使用

<table class="table table-striped table-bordered table-hover dataTable no-footer" role="grid" aria-describedby="sample_2_info"> <thead> <tr role="row"> <th tabindex="0" aria-label=&quo

JQuery的分页插件pagination.js

在页面分页的方法: ajax从后台获取数据后在前台进行分页 $.ajax({ type: "POST", url: API_CONFIG.getNews, data: JSON.stringify(params), dataType: "json", contentType: 'application/json;charset=UTF-8', success: function(data) { if(data != null) { if(data.STATUS ==

ajax 分页(jquery分页插件pagination) 小例3

<#macro ajaxPaginte url > <script type="text/javascript"> var PageSize = 10;//每页行数 var IsInit = true;//初始化 var search= function(pageIndex,initFlag) { var url = "${url}"; $.ajax({ type: 'GET', url: url, data: { pageNumber:pa

超简单实用的前端分页---jquery插件

首先,谈谈分页,目前我所了解的分页有两种,前端分页跟后台分页. 简单说说前端分页.是通过前端技术拿到所有的数据,在前端分页处理; 而后台分页是通过前端操作,给后台返回不同的值,再由后台返回所对应的数据. 最近,下载了很多前端分页插件.感觉性价比不是模糊不清,就是显示不是自己想要的,所以想自己动手写一个属于自己的插件 这是一个面向对象思想的插件.第一次用面向对象的思想,肯定有很多不足的地方.希望能互相讨论,一起上进. 这是效果图.看起来一般,但是他的css可重塑性高 接下来将附上自己的代码. cs

前端分页

一. 前端分页 1.实现思路: 当前页 currentPage : 直接获取 后端提供数据: results ( 发送请求,获取数据 ) 数据总条数:totalCount = results.length 举个栗子: 103条数据 每页10条 一共分 11 页 第一页: firstPage: 1 上一页: previousPage = Math.max(currentPage - 1, 1); 当前页 上一页 3 2 4 3 1 1 下一页: next = Math.min(currentPag