jquery前縮後縮分頁和從後臺獲取數據代碼

1.分頁
前縮後縮情況

function createPage(currentpage, totlepage) {
            //創建20個頁碼

            //根據當前頁  實現  後縮  前後縮   前縮
            var str = "";
            str += "<li class='pageup'>上一頁</li>"
            //1...1617181920   當前頁在後邊顯示
            //1 2 3 4 5....20   當前頁在前邊顯示
            for (var i = 1; i <= totlepage; i++) {
                if (i == 2 && currentpage - 3 > i) {
                    //前縮
                    i = currentpage - 3;
                    str += "<li class='pageli'>...</li>";
                }
                else if (i == currentpage + 3 && currentpage + 3 < totlepage) {
                    //後縮
                    i = totlepage - 1;
                    str += "<li class='pageli'>...</li>";
                }
                else {
                    if (i == currentpage) {
                        str += "<li class='pageli ck'>" + i + "</li>"
                    }
                    else {
                        str += "<li class='pageli'>" + i + "</li>"
                    }
                }
            }
            str += "<li class='pagedown'>下一頁</li>"
            return str;
        }

2.從後臺獲取數據方法

pageData.forEach(function(val,index){
                var pardiv=$("<div class='c_list'></div>");
                var spanid=$("<span class='title_small'>"+val.id+"</span>");
                var spanclass=$("<span class='title_small'>"+val.classid+"</span>");
                var spanname=$("<span class='title_big'>"+val.name+"</span>");
                var spansex=$("<span class='title_small'>"+val.sex+"</span>");
                var spanage=$("<span class='title_small'>"+val.age+"</span>");
                var spantel=$("<span class='title_big'>"+val.tel+"</span>");
                var spanaddress=$("<span class='title_big'>"+val.address+"</span>");
                var spanemail=$("<span class='title_big'>"+val.email+"</span>");
                pardiv.append(spanid);
                pardiv.append(spanclass);
                pardiv.append(spanname);
                pardiv.append(spansex);
                pardiv.append(spanage);
                pardiv.append(spantel);
                pardiv.append(spanaddress);
                pardiv.append(spanemail);
                $(".content").append(pardiv);
            });
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章