zoukankan      html  css  js  c++  java
  • ajax 分页完全代码整理

    /* ajax分页 */
    var page_cur = 1; //当前页 
    var total_num, page_size, page_total_num;//总记录数,每页条数,总页数
    function getData(page) { //获取当前页数据 
        $.ajax({ 
            type: 'GET', 
            url: 处理数据地址, 
            data: { 
                'page': page, 
                'catid': '{$video_info.catid}' 
            }, 
            dataType: 'json', 
            success: function(json) { 
                $("#ul_lists").empty(); 
                total_num = json.total_num; //总记录数 
                page_size = json.page_size; //每页数量 
                page_cur = page; //当前页 
                page_total_num = json.page_total_num; //总页数 
                var li = ""; 
                var list = json.list; 
                $.each(list, 
                function(index, array) { //遍历返回json
                    var curid = {$video_info.id};
                    var cur = curid == array['id'] ? "class='cur'" : "";
                    li += "<li "+cur+"><a href='地址/id/"+array['id']+"'>" + array['title'] + "</a><span>"+array['time']+"</span></li>"; 
                }); 
                $("#ul_lists").append(li); 
            }, 
            complete: function() { 
                getPageBar(); //js生成分页,可用程序代替 
            }, 
            error: function() { 
                alert("数据异常,请检查是否json格式"); 
            } 
        }); 
    }
    function getPageBar() { //js生成分页 
        if (page_cur > page_total_num) page_cur = page_total_num; //当前页大于最大页数 
        if (page_cur < 1) page_cur = 1; //当前页小于1 
        page_str = "<span>共" + total_num + "条</span><span>" + page_cur + "/" + page_total_num + "</span>"; 
        if(page_total_num > 1){
            if (page_cur == 1) { //若是第一页 
                page_str += "<span>首页</span><span>上一页</span>"; 
            } else { 
                page_str += "<span><a href='javascript:void(0)' data-page='1'>首页</a></span><span><a href='javascript:void(0)' data-page='" + (page_cur - 1) + "'>上一页</a></span>"; 
            } 
            if (page_cur >= page_total_num) { //若是最后页 
                page_str += "<span>下一页</span><span>尾页</span>"; 
            } else { 
                page_str += "<span><a href='javascript:void(0)' data-page='" + (parseInt(page_cur) + 1) + "'>下一页</a></span><span><a href='javascript:void(0)' data-page='" + page_total_num + "'>尾页</a></span>"; 
            }
        }
        $("#page").html(page_str); 
    }
    $(function() {
        getData(1);//默认第一页
        $("#page a").live('click', function() { //live 向未来的元素添加事件处理器,不可用bind
            var page = $(this).attr("data-page");//获取当前页
            getData(page)
        });
    });

    数据处理端就正常的接收参数查询数据然后返回json前台处理

  • 相关阅读:
    python3 解决tcp黏包方法一
    python3 udp不黏包但丢数据
    python3 类的单例模式
    python3 day07 练习题
    python3 tcp黏包情况二
    python3 tcp黏包情况一
    python3 subprocess模块
    python3 UDP协议下的socket
    python3 TCP协议下的socket
    python3 socket网络通信的整个流程
  • 原文地址:https://www.cnblogs.com/bieanju/p/5908325.html
Copyright © 2011-2022 走看看