zoukankan      html  css  js  c++  java
  • 分页导航 简洁版 只有上一页下一页

    之前发布过一个比较功能复杂的分页导航

    不截图了 直接粘贴 不用太感谢 点赞就行

    function pager(args) {
    var el = args.el;
    var total = args.total;
    var index = args.index;
    var callback = args.selected || function () {};
    //渲染组件
    (function render(index) {
    var nodeList = '';//以当前页码为中心,前后各取两位作为开始和结束位置
    var start = index - 1;
    var end = index + 1;//上一页页码(如果当前页码为1,则禁用上一页按钮)
    nodeList += '<a href="javascript:;" class="prev' + ((index !== 1) ? '' : ' disabled') + '">上一页</a>';
    //中间页页码
    if(index >=1 && index <= total){
    nodeList += '<a href="#" class="page active">'+index+'</a>';
    }
    //下一页页码 (如果当前页码为总页数,则禁用下一页按钮)
    nodeList += '<a href="javascript:;" class="next' + ((index !== total) ? '' : ' disabled') + '">下一页</a>';
    el.innerHTML = nodeList;
    [].forEach.call(document.querySelectorAll('.paging a:not(.disabled):not(.active)'), function (item, idx) {
    item.addEventListener('click', function (e) {
    e.preventDefault();
    if (item.classList.contains('prev')) {
    index--;
    } else if (item.classList.contains('next')) {
    index++;
    } else {
    index = Number(item.innerText);
    }
    render(index);
    callback(index);
    }, false);
    });
    nodeList = '';
    })(index);
    }
     
    额  复制的有点恶心  自己弄一个js文件放进去 直接引用
    方法   <div class=" paging "></div>
    具体js还有操作  跟原来哪一个一摸一样  具体怎么弄 找一下另一篇文章吧
    算了还是给你们粘出来吧
    http://www.cnblogs.com/WoAiZmm/p/7768117.html
    如若转载请著名出处 谢谢!
  • 相关阅读:
    x264参数
    用X264编码以后的H264数据
    (转)YUV420存储格式
    YUV数据YUY2到I420
    udp编程中,一次能发送多少个bytes为好?
    (转)c++多态实现的机制
    linux下ping加时间戳实时输出到文件 放后台运行
    如何向AcmeAir注入问题代码
    AcmeAir
    Jmeter压力测试
  • 原文地址:https://www.cnblogs.com/WoAiZmm/p/7992877.html
Copyright © 2011-2022 走看看