Saat berkembang, kita sering menghadapi masalah pagination, terutama untuk programmer back-end, tetapi masalah ini tidak dapat diselesaikan, jadi kami menemukan kontrol pagination dan merekamnya untuk penggunaan di masa depan.
Berikut adalah contoh sederhana yang digunakan di situs web resmi:
// Berikut ini akan menunjukkan halaman asynchronous $ .getjson ('test/demo1.json', {Curr: 6}, function (res) {// Permintaan dari halaman 6. Format JSON yang dikembalikan dapat menentukan tata letak ({cont: 'page1', // container. id = "page1"> </div> halaman: res.pages, // Jumlah total halaman yang diperoleh melalui latar belakang arus: 6, // menginisialisasi lompatan halaman saat ini: fungsi (e) {// memanggil panggilan balik setelah memicu halaman $ .getjson ('test/demo1.json', {Curr: e.curr}, function (reseeve) {{resrips. Halaman, Anda tidak perlu menulis // var view = document.geteLementById ('view1'); }); });Efek pagination dasar akan keluar.
Jika Anda membutuhkan efek yang lebih cantik lainnya, harap modifikasi kode sumbernya.
Mari kita bicarakan dulu, jika efek pagination disajikan.
Pertama -tama, lihat tata letak kontrol.js
<script type = "text/javaScript" src = "/lib/laypage/laypage.js"> </script>
Alamat unduhan plugin:
Sekarang mari kita lihat konfigurasi plugin:
Fungsi SearchJoinMemberInFopage () {var ccid = parseInt ($ ("#hid_ccid"). Val (), 10); var saveKey = $ ("#targetKey"). val (); var pageSize = 10; //The following will use jquery.ajax as an example to demonstrate an asynchronous page $.getJSON('/Mobile/AjaxHandler/QuestionAjax.aspx?action=GetRedisJoinMemberInformationById', { type: 2, ccId: ccId, pageIndex: 1, pageSize: pageSize, saveKey: saveKey }, function (res) { //Request starting from page 1. The Format JSON yang dikembalikan secara sewenang -wenang dapat mendefinisikan tata letak ({cont: 'Page1', // Container. Nilainya mendukung nama ID, objek DOM asli, dan objek jQuery. [Jika wadahnya]: <div id = "page1"> </div> page: res.pagecount, // Total jumlah halaman yang diperoleh melalui latar belakang arus: 1,/Kulit,/Kulit. Grup: 3, // Lewati jumlah halaman terus -menerus menampilkan lewati: true, // apakah akan membuka lompatan halaman pertama: 'beranda', // jika tidak ditampilkan, atur false terakhir: 'halaman terakhir', // jika tidak ditampilkan, atur false // prev: '<', // jika tidak ditampilkan, atur false // selanjutnya: '>', atur false // jika tidak ditampilkan, <', // jika tidak ditampilkan, set false // next:' ',', // jika tidak ditampilkan, <', // jika tidak ditampilkan, atur false /berikutnya:' ',', // jika tidak ditampilkan, <' $ .getjson ('/seluler/Ajaxhandler/quesajax.aspx? action = getredisjoinMemberinformationById', {type: 2, ccid: ccid, pageIndex: e.curr, // jumlah halaman saat ini: pagesze, saveKey}, fungsi (rese) {e.pages = E. perlu menulis // var view = document.geteLementById ('userTable');/Mobile/ajaxhandler/questionajax.aspx?action=GetRedisjoinMemberInformationById Menampilkan alamat asinkron yang mengembalikan data yang akan ditampilkan dan jumlah halaman. jenis:
2, CCID: CCID, PageIndex: 1, PageSize: PageSize, Savey: Savey adalah parameter yang perlu digunakan dalam asinkron.
Packagdata (res); Fungsi ini mem -parsing data yang dikembalikan dan membuatnya.
UserTable adalah simpul DOM yang digunakan untuk menampilkan data yang dikembalikan, dan Page1 adalah simpul DOM yang digunakan untuk menampilkan tombol untuk jumlah halaman.
Sekarang lihat efeknya:
Ini sebenarnya sangat sederhana, dan ini melengkapi tampilan pagination.
Terima kasih atas bacaan Anda, dan saya harap Anda akan terus memperhatikan konten yang lebih menarik dari wulin.com.