首頁 > web前端 > js教程 > jquery實作pager控制項範例_jquery

jquery實作pager控制項範例_jquery

WBOY
發布: 2016-05-16 16:52:53
原創
1384 人瀏覽過

js:

複製程式碼 程式碼如下:

$.fn.extend({ JPager: function (cfg, pageIndex, pageSize) {
    if (cfg && pageIndex > 0 && pageSize>0) {        this.empty();
        var pageFirst = function () {        }; 🎜 >
        var pagePre = function () {
            
        var pageLast = function () {
            $(token).JPager(cfg, parseInt($("#_tot").val()), pageSize);
   unction () {
$ (token).JPager(cfg, pageIndex 1, pageSize);
        };

      ken).JPager(cfg, parseInt($($) ( this).text()), pageSize);
        };

        var pos").val()) ;
            var total = parseInt($("#_tot").val());
          if (索引> 總計) {
                   $(至肯).JPager ( cfg, 總計, pageSize);
                }
        1) {
                    $(token).JPager(cfg, 1,            其他{
                           }
            }
        };
       Number(this.value)) {
                this.value = "";
          else {
                this.value = Number(this.value);
          ;
        var initCustomer = function (recordCount) {
            late) {
                    var t = cfg.custom呃.模板;
t = t.replace(/%total%/gi, Math.ceil(recordCount / pageSize)).replace(/%current%/gi, pageIndex).replace(/%recordCount%/gi, recordCount).replace(/ % pageSize%/gi, pageSize);
                   if (cfg.customer.position == $("#_right").after(t);
                   }
    {
                        $("#_left").before(t);
                   }
                }
            }
        };

        var changeState = 函數(總共){
if (pageIndex == 1) {
                $("#_first").attr("class", r("class", "無法“);
}
else {
$(“ #_ first”)。bind(“ click”,pagefirst).ATTR(“ class”,“ number”);
$(“ #            $("#_last" ). attr(“ class”,“ cosse”);
$(“ #_ next”)。 “ #_最後” ).bind("click", pageLast).attr("class", "number");
                $("#_next").bind("click. class", "number ");
            }
        };
        if (總計 >; 0 && 統計 > 0) {
                若(目前                }
                若(目前 >總計){
                  }
                var endIndex = 總計;
                var startIndex = 1;
               var temp = 當前Math.floor(count / 2);
                if (temp                     if (溫度                        endIndex =                其他{
                                 endIndex = temp;
               }
                其他{
                    if (總計> 數) {
        >                    }
             _number").empty();
                 for (var i = startIndex; i                    var html = $("                       $("#_number").append(       }
                    其他{
    ) .append(html.attr("class", "number"));
                    }        };

        var initPager = function (data) {
                    $(token).append("首頁  上一頁    下頁  末頁 ");
                var Total  $("#_tot"). val(總計);
                $("#_pos").bind("blur“,checkgonumber);
$(“#_ to”)。 🎜>
更改狀態(總計);
if(cfg.shownumber && cfg.count&gt&gt ; 0) {
                      }
                ininitCustomer(資料.RecordCount);
            }
        };
               var d = cfg.action.data.substr(0, cfg.action.data.lastIndexOf("}") ) ',"pageIndex":'pageIndex',"pageSize":'pageSize "}";
   action.callback && $.isFunction(cfg.action.callback)) {
                    $.ajax ({
                      類型:“post”,
                      url:cf g.action.url,
                        數據類型: “json”,
                        contentType: d,
                        成功:函數(資料){                           回調。              }
                else {
                         type: "post",
                                dataType: "json",
                 json",
                        data: d,
    (data) {
                                }
                    });        }
    }
}
});



css:

複製程式碼

程式碼如下:__pos>_Dis> : 40px;}.unable{
    color: #BCC0BB;
}
.number{ 0000FF;
    text-decoration:underline;
}
.selected
{
    margin: 2px; ; 🎜 >}



html:




複製代碼


代碼如下:


    分頁控制範例








  
wcf:












程式碼如下:

使用System;
使用System.Collections.Generic;
使用System.Linq;
使用System.Runtime.Serialization;
使用System.ServiceModel;使用System.ServiceModel.Web;
命名空間JPlugin

{
    [ServiceContract]
    [AspNetCompatibilityRequirements(RequirementsMode = AspNetCompatibilityRe       [OperationContract]
        [WebInvoke ]
        public PageObject; GetPersons(string name,int pageIndex,int paseSize)
        {
@ ult = new List() {new Person(){Name="zhpulq ",年齡= 28},new Person(){姓名= "zhouxy",年齡= 24}};
        }
    }    }

    public class PageObject
    {

        public int RecordCount { get;放; }

        公開列表;搜索結果{獲取;放; }
    }
}


相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
最新問題
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板