码迷,mamicode.com
首页 > Web开发 > 详细

jquery ajax 分页2

时间:2015-03-19 12:57:23      阅读:137      评论:0      收藏:0      [点我收藏+]

标签:

/*
* 分页   $("#divPager").flexipager
*  2015.03.17
*/

//初始化列表默认属性
(function($) {
    $.addFlex = function(t, p) {
        if (t.pager) return false;   // 若已经存在Pager - DIV 对象则return
        p = $.extend({ 
            url: false,             // 获取数据源对应的url地址
            async: true,            // 默认异步加载(false=同步)
            method: ‘POST‘,         // 数据发送方式
            dataType: ‘json‘,       // 数据加载的类型,json
            page: 1,                // 当前页
            newp: 1,                // 默认当前页
            total: 1,               // 总页面数
            rp: 2,                 // 每页默认的结果数
            sortname: "",           // 排序字段
            sortorder: "",          // asc desc
            primaryKey: "",         // 主键字段名
            coloursEvent: ""     // 界面渲染
        }, p);

        $(t).show().attr({ cellPadding: 0, cellSpacing: 0, border: 0 }).removeAttr(‘width‘);

        var g = {
            //分页
            buildpager: function() {
                //                g.pDiv = document.createElement(‘div‘);
                //                g.pDiv.innerHTML = ‘<div class="pDiv2"></div>‘;

                //                alert($(g.pDiv).html());
                //                alert($(this.pDiv).html());

            var html = "<span class=‘pFirst‘>首页</span>&nbsp;<span class=‘pPrev‘>上一页</span>&nbsp;<span class=‘pPageStatr‘>1</span>/<span class=‘pTotal‘>1</span>&nbsp;<span class=‘pNext‘>下一页</span>&nbsp;<span class=‘pLast‘>尾页</span>&nbsp;&nbsp;&nbsp;";
                html += "<span>共&nbsp;</span><span class=‘rTotal‘>0</span><span>&nbsp;条记录</span> ";

                $(t).append(html);

                $(‘.pFirst‘, t).click(function() { g.changePage(‘first‘) });
                $(‘.pPrev‘, t).click(function() { g.changePage(‘prev‘) });
                $(‘.pNext‘, t).click(function() { g.changePage(‘next‘) });
                $(‘.pLast‘, t).click(function() { g.changePage(‘last‘) });
                this.populate();
            },
            //获取数据
            populate: function() {

                if (p.page > p.pages)
                    p.page = p.pages;

                var param = [
                      { name: ‘page‘, value: p.newp }
                    , { name: ‘rp‘, value: p.rp }
                    , { name: ‘sortname‘, value: p.sortname }
                    , { name: ‘sortorder‘, value: p.sortorder }
                    , { name: ‘primaryKey‘, value: p.primaryKey }

                ];

                $.ajax({
                    type: p.method,
                    url: p.url,
                    async: p.async,
                    data: param,
                    success: function(data) {
                        data = "[" + data + "]";
                        var page = eval(data)[0].page;
                        var total = eval(data)[0].total;
                        var json = eval(data)[0].rows;

                        p.pages = Math.ceil(parseInt(total) / 2);

                        $(".pTotal", t).html(p.pages); //页数
                        $(".rTotal", t).html(total); //总记录
                        $(".pPageStatr", t).html(p.page);  //当前页

                        //alert(json);
                        if (p.coloursEvent)
                            p.coloursEvent(json);

                    },
                    error: function(data) {
                        alert("error:");
                        try {
                        } catch (e) { alert("error:"); }
                    }
                });
            },

            //翻页
            changePage: function(ctype) {
                //alert(ctype);
                switch (ctype) {
                    case ‘first‘:
                        //p.page = p.newp = 1;
                        p.newp = 1;
                        break;
                    case ‘prev‘:
                        if (p.page > 1)
                            p.newp = parseInt(p.page) - 1;
                        break;
                    case ‘next‘:
                        if (p.page < p.pages)
                            p.newp = parseInt(p.page) + 1;
                        break;
                    case ‘last‘:
                        p.newp = p.pages;
                        break;
                }

                if (p.newp == p.page)
                    return false;

                p.page = p.newp;

                this.populate();
            }
        };

        g.buildpager();
        t.p = p;
        t.pager = g;
        if (p.url && p.autoload) {
            g.populate();
        }
        return t;
    };
    
    var docloaded = false; //文档加载完毕标识
    $(document).ready(function() { docloaded = true });
    var urlString = document.location.pathname; //当前页面的url
    var huayingPageRpNum = urlString + "-huayingPageRpNum"; //设置当前页面的分页条数

    //构造函数
    $.fn.flexipager = function(p) {
        return this.each(function() {
            if (!docloaded) {
                $(this).hide();
                var t = this;
                $(document).ready(function() { $.addFlex(t, p); });
            } else {
                $.addFlex(this, p);
            }
        });
    };

})(jQuery);
var hyajax =
{
    eventAjax: function() {

    },
    executeAjax: function(requestType) {
        var xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
        xmlhttp.onreadystatechange = hyajax.eventAjax
        xmlhttp.open("")
    }
}
    <script src="ETOS_Js/Plugin/jQuery/jquery-1.8.2.min.js" type="text/javascript"></script>
    <script src="ETOS_Js/JsPager/JsPager.js" type="text/javascript"></script>
    
    <script type="text/javascript">
        $(document).ready(function() {

            $("#divPager").flexipager({
                url: "/Handlers/Topics.ashx?Action=Get_AnswerList",
                sortname: "createTime",
                sortorder: "desc",
                coloursEvent: addData
            });



        });

        function addData(json) {
            alert(json + " 3234");//返回一个json数据 在进行解析数据
        }
        
    </script>

 

jquery ajax 分页2

标签:

原文地址:http://www.cnblogs.com/dragon-L/p/4349923.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!