[js开源组件开发]ajax分页组件
ajax分页组件
我以平均每一周出一个开源的js组件为目标行动着,虽然每个组件并不是很庞大,它只完成某一个较小部分的工作,但相信,只要有付出,总会得到回报的。这个组件主要完成分页的工作。

这张图里显示的是这个分页控件的两种基本形态,样式可以自己定制,包括文案内容。
这个分页控件的demo演示地址是: http://www.lovewebgames.com/jsmodule/paging.html
同时,它还是开源的,它的git 地址是:https://github.com/tianxiangbing/paging
paging
分页控件paging 例子见DEMO
使用方法案例:
<div id="pageTool"></div>
$('#pageTool').Paging({pagesize:10,count:100});
或者
var p = new Paging();
p.init({target:'#pageTool',pagesize:10,count:100});
属性和方法
pagesize:
每页的条数
current:
当前页码,默认为1
prevTpl
上一页的模板,默认“上一页”
nextTpl
下一页的模板,默认“下一页”
firstTpl
首页的模板,默认“首页”
lastTpl
末页的模板,默认“末页”
ellipseTpl
省略号的模板,默认“...”
toolbar: bool
是否显示工具栏,默认为false
pageSizeList:[]
当显示工具栏时有效,可设置每页条数,默认为[5,10,15,20]
changePagesize:function(ps)
修改每页的条数,参数为int
go:function(p)
跳转至某一页,默认到current
render:function(ops)
重新渲染,ops:{count:int,pagesize:int,current:int,pagecount:int}
[js开源组件开发]ajax分页组件的更多相关文章
- 手把手教你使用Vue/React/Angular三大框架开发Pagination分页组件
DevUI是一支兼具设计视角和工程视角的团队,服务于华为云DevCloud平台和华为内部数个中后台系统,服务于设计师和前端工程师.官方网站:devui.designNg组件库:ng-devui(欢迎S ...
- [js开源组件开发]table表格组件
table表格组件 表格的渲染组件,demo请点击http://lovewebgames.com/jsmodule/table.html,git源码请点击https://github.com/tian ...
- [js开源组件开发]tip提示组件
tip提示组件 常见的应用场景中,总是难免会遇到提示信息,比如显示不完全时需要鼠标移上去显示title,比如验证时的错误提示,比如操作按钮的辅助说明等,所以我独立出来了一个小的js组件,tip提示组件 ...
- stark组件开发之分页
""" 分页组件 """ class Pagination(object): def __init__(self, current_page ...
- Vue.js高效前端开发 • 【Vue组件】
全部章节 >>>> 文章目录 一.Vue组件介绍 1.组件概述 2.组件使用步骤 3.实践练习 一.Vue组件使用 1.组件注册 2.组件注册语法糖 3.使用script或te ...
- 一步步编写avalon组件02:分页组件
本章节,我们做分页组件,这是一个非常常用的组件.grid, listview都离不开它.因此其各种形态也有. 本章节教授的是一个比较纯正的形态,bootstrap风格的那种分页栏. 我们建立一个ms- ...
- DRF框架(八)——drf-jwt手动签发与校验、搜索过滤组件、排序过滤组件、基础分页组件
自定义drf-jwt手动签发和校验 签发token源码入口 前提:给一个局部禁用了所有 认证与权限 的视图类发送用户信息得到token,其实就是登录接口,不然进不了登录页面 获取提交的username ...
- FineReport——JS二次开发(分页预览)
BS访问某个cpt模板,报表servlet将会将cpt文件解析成对应的html,报表内容最终转换为一个table,位于id=content-container的div中. 在模板和html页面中,他们 ...
- [js开源组件开发]query组件,获取url参数和form表单json格式
query组件,获取url参数和form表单json格式 距离上次的组件[js开源组件开发]ajax分页组件一转眼过去了近二十天,或许我一周一组件的承诺有了质疑声,但其实我一直在做,只是没人看到……, ...
随机推荐
- How does Spring @Transactional Really Work?--转
原文地址:http://blog.jhades.org/how-does-spring-transactional-really-work/ In this post we will do a dee ...
- 学习使用 CSS3 制作网站面包屑导航效果
作为最重要的导航展示形式之一,面包屑导航能够让用户更清楚的知道他们所在页面的层次结构,让他们可以方便的导航到上一层页面.在本教程中,您将学习如何使用 CSS3 技术创建自己的面包屑导航效果. 效果演示 ...
- 使用ajax提交form表单,包括ajax文件上传
前言 使用ajax请求数据,很多人都会,比如说: $.post(path,{data:data},function(data){ ... },"json"); 又或者是这样的aja ...
- Azure ARM (4) 开始创建ARM Resource Group并创建存储账户
<Windows Azure Platform 系列文章目录> 好了,接下来我们开始创建Azure Resource Group. 1.我们先登录Azure New Portal,地址是: ...
- Azure Redis Cache (4) 配置和管理Redis Cache
<Windows Azure Platform 系列文章目录> 我们在创建完Azure Redis Cache后,经常需要切换Redis Cache的服务级别,这里我简单介绍一下使用Azu ...
- velocity的一些用法
velocity模板其实就是java不分语法的翻译,用到的属性还是java的方法,get,set,等 1.截取部分字段substring 原始字符串:$!ag.tagValue,也许很长,前端页面展示 ...
- Windows Server 2012上PHP运行环境搭建的简易教程(Win08适用)
微软的Windows Server 2012发布后,第一时间进行了简单的试用,非常不错,特写了个简易的PHP环境搭建教程.先来欣赏下Win2012的登录界面吧第一步我们需要安装IIS81.点击任务栏最 ...
- ADO.NET基础03
数据库和VS的连接,实现数据的同步,让用户的一切信息都可以在数据库中留下记录. ADO.NET基础 它是连接所有数据库的一种特殊的技术,提供对不同的数据库统一操作接口. 在VS中也可以添加数 ...
- Microsoft Orleans 之 入门指南
Microsoft Orleans 在.net用简单方法构建高并发.分布式的大型应用程序框架. 原文:http://dotnet.github.io/orleans/ 在线文档:http://dotn ...
- 两个dropDownList和一个GridView的选择与显示
很久没有写ASP.NET了,今天有看到论坛上一个问题:"两个dropDownList和一个GridView,已经进行了数据绑定,现在想让第一个下拉菜单的数据改变时,第二个下拉菜单自动变到相应 ...