国产xxxx99真实实拍_久久不雅视频_高清韩国a级特黄毛片_嗯老师别我我受不了了小说

資訊專欄INFORMATION COLUMN

自制jq分頁插件

Little_XM / 2643人閱讀

摘要:由于第一次寫插件,中間有借鑒別人的代碼。添加選中藍色背景上一頁下一頁點擊的頁數下一頁上一頁用法總頁數當前選中頁回調函數

由于第一次寫jq插件,中間有借鑒別人的代碼。

 (function(){
    var ms = {

        fillHtml: function(obj, option) {
            obj.empty();
            var totalPage = option.pageCount,
                pageHtml = "",
                dotHtml = "
  • ...
  • ", tempHtml = ""; if (option.currentPage > 5) { tempHtml = "
  • 1
  • 2
  • ...
  • "; for(var i = option.currentPage - 2 ; i <= (option.currentPage + 2 > totalPage ? totalPage : option.currentPage + 2); i++) { var temp = "
  • " +i+ "
  • "; if (option.currentPage === i ) { temp = "
  • "+ i +"
  • "; } if (option.currentPage >= totalPage - 2) { dotHtml = ""; } pageHtml += temp; }; }else { for(var i = 1; i <= ( 6 > totalPage ? totalPage : 6); i++) { var temp = "
  • " +i+ "
  • "; if (option.currentPage === i ) { //添加選中藍色背景 temp = "
  • "+ i +"
  • "; }; if (option.currentPage >= totalPage - 2) { dotHtml = ""; } pageHtml += temp; }; } pageHtml = ""; obj.append(pageHtml); }, bindEvent: function(obj, option) { $(obj).on("click",".page-num",function(){ if ($(this).parent("li") && $(this).parent("li").hasClass("current-page")) { return; } var current = Number( $(this).text() ); //點擊的頁數 ms.fillHtml(obj, {"currentPage": current, "pageCount": option.pageCount}); option.backFunction(); }); $(obj).on("click",".next-page",function(){ var current = Number( $(".current-page a").text() ); //下一頁 if (current === option.pageCount){ return; } ms.fillHtml(obj, {"currentPage": current + 1, "pageCount": option.pageCount}); option.backFunction(); }); $(obj).on("click",".prev-page",function(){ var current = Number( $(".current-page a").text() ); //上一頁 if (current === 1){ return; } ms.fillHtml(obj, {"currentPage": current-1, "pageCount": option.pageCount}); option.backFunction(); }); }, init: function(obj, option){ return (function(){ ms.fillHtml(obj, option); ms.bindEvent(obj, option); })(); } }; $.fn.creatPage = function(option) { var initOption = { pageCount: 10, currentPage: 1, backFunction: function(){} }; option.pageCount = Number(option.pageCount); option.currentPage = Number(option.currentPage); var option = $.extend(initOption, option); ms.init(this, option); } })()

    HTML

    用法

    $("#pageCont").creatPage({
            pageCount: 18,            //總頁數
            currentPage: 1,            //當前選中頁
            backFunction: function(){    //回調函數
                
            }
        });

    文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。

    轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/111710.html

    相關文章

    • 自制jq分頁插件

      摘要:由于第一次寫插件,中間有借鑒別人的代碼。添加選中藍色背景上一頁下一頁點擊的頁數下一頁上一頁用法總頁數當前選中頁回調函數 由于第一次寫jq插件,中間有借鑒別人的代碼。 (function(){ var ms = { fillHtml: function(obj, option) { obj.empty(); v...

      or0fun 評論0 收藏0
    • 前端常用插件、工具類庫匯總(上)

      摘要:函數庫動畫庫動畫庫,也是目前最通用的動畫庫。下拉框級聯選擇器移動端最好用的的篩選器組件聯動篩選移動端最好用的的篩選器組件聯動篩選顏色選擇器時間選擇器時間日期處理是一個解析,驗證,操作和顯示日期和時間的類庫。 showImg(https://segmentfault.com/img/bVbjpHt?w=900&h=383); 前言 在開發中,我們經常會將一些常用的代碼塊、功能塊進行封裝,...

      txgcwm 評論0 收藏0
    • 前端常用插件、工具類庫匯總(下)

      摘要:上一篇前端常用插件工具類庫匯總上內容摘要動畫庫滾動庫輪播圖滾屏彈出框消息通知下拉框級聯選擇器顏色選擇器時間日期處理表單驗證分頁插件本篇延續上一篇的內容繼續給大家帶來一系列關于前端插件工具類的內容。 showImg(https://segmentfault.com/img/bVbjsMh?w=900&h=383); 前言 對本文感興趣可以先加個收藏,也可以轉發分享給身邊的小伙伴,以后遇到...

      ideaa 評論0 收藏0
    • jq easyui數據網絡的分頁過程

      摘要:在涉及到組件的分頁功能時,遇到了一點問題。由于數據較多,這邊不予展示。返回的數據必須是符合要求的數據,格式如下必須帶有屬性,屬性值為總共的數據條數,是這一頁的數據內容,以數組對象的形式返回。 第一次寫技術方面的文章,有點忐忑,總怕自己講的不對誤導別人。但是萬事總有個開頭,有不足錯誤之處,請各位讀者老爺指出。 言歸正傳,最近剛進新公司,上頭要求我先熟悉熟悉easyui這個組件庫。在涉及到...

      Rainie 評論0 收藏0

    發表評論

    0條評論

    Little_XM

    |高級講師

    TA的文章

    閱讀更多
    最新活動
    閱讀需要支付1元查看
    <