jQuery插件simplePagination的使用-踩坑記_03

羅志環發布于2019-08-02 11:35 / 578人閱讀

摘要：插件的使用正在熟悉項目上的代碼，新添加了一個需要，需要對表單進行分頁，之前的代碼中是有分頁的代碼的，看了老半天，也沒看太明白。

jQuery插件simplePagination的使用

正在熟悉項目上的代碼，新添加了一個需要，需要對表單進行分頁，之前的代碼中是有分頁的代碼的，看了老半天，也沒看太明白。之前的項目比較久遠，繼續熟悉代碼。

simplePagination的使用

HTML頁面，

因為項目里用到EJS--HTML模板，記得在一開始就引用SimplePagination插件，這個比較簡單，就不細說了。

JS代碼

var page_count = 0;
// 定義分頁的頁數
var limit = 0 ;
// 定義分頁的條數
var regionLogListFunc = function(pageNumber){
    if(pageNumber=== undefined){
        pageNumber = 1;
    }
    // 頁數判斷和定義
    $get("/regionCopyList?page_number="+ pageNumber,function(data,status){    
        var #### = jQuery("####-##");
        // 獲取Table中 tbody的id值
        var updateRegionlogList = ""
         // for in 遍歷 對傳入的數據進行顯示
        for (var i in data){
            #### +="";
            ##### +=""+data[i].##+"";
            ##### +=""+data[i].##"";
            #### +=""+data[i].##+"";
            #### +=""+data[i].##+"";            
            updateRegionlogList +="";            
        } 
      regionPriceList.empty();
        //    添加更新的數據
      regionPriceList.append(updateRegionlogList);
    });
    var onPageClick = regionLogListFunc;
    //  獲取DOM文檔ID
    jQuery("#pagination").pagination({
        item        :<%=z###%>, //ejs模板
        itemsOnPage :<%=#####t%> ,//ejs模板
        cssStyle    :"light-theme",
        onPageClick :onPageClick,
        onInit      :regionLogListFunc,
    });
});

另外一種寫法是

var page_index;
var itemsOnPage = 1;
$(function() {
$("#pagination").pagination({
    items: {$page_count},  總頁數
    itemsOnPage: itemsOnPage,
    cssStyle: "light-theme",
    onInit: changePage,   // 初始化函數
    onPageClick: changePage   //點擊時觸發函數
    }); 
}); 
function changePage(page_index,event){ 
    listTable.gotoPage(page_index);    //gotoPage函數調用ajax獲取數據 填充頁面
    document.getElementById("pageCurrent").innerHTML=page_index; 
    return true; 
}

云服務器 GPU云服務器踩坑記采坑記 jquery插件源碼jquery jquery插件

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

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

jQuery插件simplePagination的使用_03

摘要：插件的使用正在熟悉項目上的代碼，新添加了一個需要，需要對表單進行分頁，之前的代碼中是有分頁的代碼的，看了老半天，也沒看太明白。 jQuery插件simplePagination的使用正在熟悉項目上的代碼，新添加了一個需要，需要對表單進行分頁，之前的代碼中是有分頁的代碼的，看了老半天，也沒看太明白。之前的項目比較久遠，繼續熟悉代碼。 simplePagination的使用 HTML頁面...

NotFound 2019-08-23 12:04 評論0 收藏0
vue-cli +webpack+vue-router 踩坑記

摘要：其中定義了一些命令，還記得我們初始化項目完成后執行其實就是執行簡單的來說是運行時依賴生產環境，是開發時的依賴開發環境相應的在安裝包時，有兩種命令參數可以把它們的信息寫入文件，會把依賴包名稱添加到文件鍵下，則添加到文件鍵下。這次主要是記錄下自己在做vue-cli +webpack +vue-router 的經歷以及一些踩過的坑，算是做一個簡單的總結一.vue的基本介紹 1）漸進式的...

OpenDigg 2019-08-21 17:51 評論0 收藏0
vue-cli3.x 新特性及踩坑記

摘要：前言都到了，所以是時候玩轉一下的新特性了。安裝的包名稱由改成了。方法一原因的配置改變了，導致正確的不能用。打開終端，切換到根路徑文件里面修改為方法二是默認路徑修改了路徑會出現錯誤。按上面的方法修改完，再全局卸載果然就成功了。 showImg(https://segmentfault.com/img/remote/1460000016423946); 前言 vue-cli 都到 3.0....

xiaoqibTn 2019-08-23 12:01 評論0 收藏0
webpack4 踩坑記

最近偶然想學習下webpack的配置，于是走上了webpack4踩坑的不歸路。。。 webpack4默認的特性：配置默認初始化一些配置, 比如 entry 默認 ./src 開發模式和發布模式, 插件默認內置 CommonsChunk 配置簡化使用 ES6 語法，比如 Map, Set, includes 新增 WebAssembly 構建支持如果要使用 webpack cli 命令，...

lookSomeone 2019-08-26 11:51 評論0 收藏0