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分页组件的更多相关文章

  1. 手把手教你使用Vue/React/Angular三大框架开发Pagination分页组件

    DevUI是一支兼具设计视角和工程视角的团队,服务于华为云DevCloud平台和华为内部数个中后台系统,服务于设计师和前端工程师.官方网站:devui.designNg组件库:ng-devui(欢迎S ...

  2. [js开源组件开发]table表格组件

    table表格组件 表格的渲染组件,demo请点击http://lovewebgames.com/jsmodule/table.html,git源码请点击https://github.com/tian ...

  3. [js开源组件开发]tip提示组件

    tip提示组件 常见的应用场景中,总是难免会遇到提示信息,比如显示不完全时需要鼠标移上去显示title,比如验证时的错误提示,比如操作按钮的辅助说明等,所以我独立出来了一个小的js组件,tip提示组件 ...

  4. stark组件开发之分页

    """ 分页组件 """ class Pagination(object): def __init__(self, current_page ...

  5. Vue.js高效前端开发 • 【Vue组件】

    全部章节 >>>> 文章目录 一.Vue组件介绍 1.组件概述 2.组件使用步骤 3.实践练习 一.Vue组件使用 1.组件注册 2.组件注册语法糖 3.使用script或te ...

  6. 一步步编写avalon组件02:分页组件

    本章节,我们做分页组件,这是一个非常常用的组件.grid, listview都离不开它.因此其各种形态也有. 本章节教授的是一个比较纯正的形态,bootstrap风格的那种分页栏. 我们建立一个ms- ...

  7. DRF框架(八)——drf-jwt手动签发与校验、搜索过滤组件、排序过滤组件、基础分页组件

    自定义drf-jwt手动签发和校验 签发token源码入口 前提:给一个局部禁用了所有 认证与权限 的视图类发送用户信息得到token,其实就是登录接口,不然进不了登录页面 获取提交的username ...

  8. FineReport——JS二次开发(分页预览)

    BS访问某个cpt模板,报表servlet将会将cpt文件解析成对应的html,报表内容最终转换为一个table,位于id=content-container的div中. 在模板和html页面中,他们 ...

  9. [js开源组件开发]query组件,获取url参数和form表单json格式

    query组件,获取url参数和form表单json格式 距离上次的组件[js开源组件开发]ajax分页组件一转眼过去了近二十天,或许我一周一组件的承诺有了质疑声,但其实我一直在做,只是没人看到……, ...

随机推荐

  1. Docker之Linux UnionFS

    UnionFS UnionFS是一种为Linux,FreeBSD和NetBSD操作系统设计的把其他文件系统联合到一个联合挂载点的文件系统服务.它使用branch把不同文件系统的文件和目录"透 ...

  2. 面向对象编程语言中的接口(Interface)

    在大多面向对象的编程语言中都提供了Interface(接口)的概念.如果你事先学过这个概念,那么在谈到“接口测试”时,会不会想起这个概念来!?本篇文章简单介绍一下面向对象编程语言中的Interface ...

  3. Web 前端开发精华文章集锦(jQuery、HTML5、CSS3)【系列十九】

    <Web 前端开发精华文章推荐>2013年第七期(总第十九期)和大家见面了.梦想天空博客关注 前端开发 技术,分享各种增强网站用户体验的 jQuery 插件,展示前沿的 HTML5 和 C ...

  4. Java性能优化

    作者:禅楼望月(http://www.cnblogs.com/yaoyinglong) 注:里面的测试结果会因电脑配置的不同而有所差异!!! 1. 为一些集合定义初始化大小 List.Set.Map都 ...

  5. Android中动态更新ListView(转)

    在使用ListView时,会遇到当ListView列表滑动到最底端时,添加新的列表项的问题,本文通过代码演示如何动态的添加新的列表项到ListView中.实现步骤:调用ListView的setOnSc ...

  6. Windows Azure Cloud Service (36) 在Azure Cloud Service配置SSL证书

    <Windows Azure Platform 系列文章目录> 在某些时候,我们需要在Azure PaaS Cloud Service配置HTTPS连接.本章将介绍如何在本地创建证书,然后 ...

  7. Redhat7.2 如何修改主机名(hostname)?

    Redhat7.2 在安装的时候,会默认生成主机名:localhost. 那么如何修改成自己想要的自己名? //格式为:用户名@主机名 比如: [root@localhost ~]#  修改成[roo ...

  8. 【Swift学习】Swift编程之旅---方法(十五)

    在Swift中结构体和枚举也能够定义方法,而在 Objective-C 中,类是唯一能定义方法的类型. 实例方法 实例方法是属于某个特定类.结构体或者枚举类型实例的方法,实例方法提供访问和修改实例属性 ...

  9. C语言学习013:通过make编译C源代码

    编译多个C源代码文件 当程序文件越来越多,修改了其中的一部分代码文件,我们并不需要全部重新编译,只需要编译其中一部分就可以,下面我们创建了一个launch程序,除了主程序,我们创建了3个功能代码文件r ...

  10. DOS 和 Linux 常用命令的对比

    DOS 和 Linux 常用命令的对比 许多在 shell 提示下键入的 Linux命令都与你在 DOS 下键入的命令相似.事实上,某些命令完全相同. 本附录提供了 Windows的 DOS 提示下的 ...