npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

jquery-pagination

v1.1.0

Published

A light 、highly customizability and very easy use jquery plugin for pagination ^ ^

Downloads

43

Readme

jquery.pagination.js

npm lisence

A light 、highly customizability and very easy use jquery plugin for pagination ^ ^

preview

史上易用性最强的分页插件,压缩后仅为4kb

  • 多条件动态分页实例
  • 提供多种API接口以供扩展功能
  • 自定义回调函数支持
  • 可自定义页码显示数量
  • 可自定义按钮名称
  • 可选的省略号、首页尾页按钮
  • 样式完全可自定义化(默认不加载任何样式,干净利落,根据需求添加样式)
  • 所有元素类名可自定义

Usage

方法一:直接引入

<script src="jquery.min.js"></script>
<script src="jquery.pagination.min.js"></script>

<div id="pager"></div>

<script>
//这里列出了4个常用的设置,不设置就采用默认配置
var pager = $('#pager').paginate({
        pageIndex: 0, //当前页数
        totlePageCount: 16, //总页数
        maxBtnCount: 7, //按钮数量最多有
        styleURL: './defaultStyles/style1.css' //样式路径 默认无样式
});
</script>

npm install jquery-pagination

then use npm test if u want.

You want More

可选配置和API

|名称|类型|作用|默认值| |--- |---|---|---| |pageIndex|Number|当前页码|0| |totlePageCount|Number|总页码|16| |maxBtnCount|Number|最大显示按钮数量|7| |hasDots|Boolean|是否显示省略号|true| |hasFirstLast|Boolean|是否开启首尾页跳转功能|true| |styleURL|String|自定义样式路径(默认不加载样式)|空字符串| |btnClass|String|数字按钮类名|'pager-numbtn'| |pageTurnClass|String|翻页按钮类名|'pager-turnbtn'| |firstLastClass|String|首页尾页按钮类名|'pager-flbtn'| |prevPageName|String|"上一页"标签文字|'prev'| |nextPageName|String|"下一页"标签文字|'next'| |firstPageName|String|"首页"标签文字|'First Page'| |lastPageName|String|"尾页"标签文字|'Last Page'|

var pager = $('#pager').paginate();

pager.set(option, value)

更改配置属性

@param {String} option 要设置的配置属性

@param {String}{Number}{Boolean} value 要设置的值

pager.getPageIndex()

获取当前页

@param {Number} pageIndex 要跳转到的页码(值为实际页码减一,如:跳到第3页就传入2)

pager.turnToPage(pageIndex)

跳转页码

@param {Number} pageIndex 要跳转到的页码(值为实际页码减一,如:跳到第3页就传入2)

LISENCE

MIT