今天琢磨用一个分页插件来着;用的自取

头部内容 需要引用JQ;

---

来一个简单是我样式

分页插件用到的图片.jpeg

body内容

    
分页的内容


上一页的另外一个按钮
下一页的另外一个按钮

    

js脚本的内容

var option={
        viewedIndex : 5, //一次能看到的页码数
        currentPage :1, //当前页码
        totalPage : 20, //总共页数
        //preVisible : true, //永远都显示上一页按钮，即使上一页按钮不可用
        nextVisible : true,
        gotoVisible : true,
        edgeNum : 1,//尾页显示的个个数;
        gotoPreText : '',
        gotoText : " ",
        canClick_pre : '上一页',
        canClick_pre_seo : '上一页',
        cannotClick_pre : '已经在第一页了',
        callbackFn:function(api){
            //点击按钮的回调函数
            currentNum=api;
            getData(currentNum);
        }
};
var currentNum=option.currentPage;
getData(currentNum);

$(".box").pmPagination(option);
$(".prev1").on("click",function(){
    currentNum<=1?currentNum=1:currentNum-=1;
    option.currentPage=currentNum;
    $(".box").pmPagination(option);
    getData(currentNum)
});
$(".next1").on("click",function(){
    currentNum>=option.totalPage?currentNum=option.totalPage:currentNum+=1;
    option.currentPage=currentNum;
    $(".box").pmPagination(option);
    getData(currentNum)
});
function getData(currentNum){
    console.log("第"+currentNum+"页数据请求成功")
}
// console.log($(".box").pmPagination);