Bootstrap Paginator Paging Plugin Address:
Downloadvisit Project di GitHub
1. Ini adalah fungsi JS yang perlu ditempatkan pada halaman yang perlu di -paginasi:
<span style = "font-size: 14px;"> function paging (page) {$ .Ajax ({type: "get", url: "$ {ctx}/API/v1/user/1/"+(page-1)+"/5", DataType: "JSON", SUCCEST: FUNCUE (msg) {... $ .Ajax ({type: "get", url: "$ {ctx}/API/v1/user/count/1", DataType: "json", Success: function (msg) {var page = math.ceil (msg.data/5); // Jumlah total data dalam data di sini elemen var = $ $ ('#page.'); Bootstrapmajorversion: 3, CurrentPage: Halaman, // Halaman saat ini Numberofpages: 5, // Beberapa tombol ditampilkan pada halaman (5 LIS dihasilkan dalam UL) Total Halaman: Halaman // Jumlah Total Halaman} Element.Bootstrappaginator (Opsi); } </span>halaman:
<span style = "font-size: 14px;"> <ul id = "pageul"> </ul> </span>
*Secara otomatis dihasilkan di LI
2. Hal yang paling penting dan inti adalah mengubah file sumber bootstrap-paginator.js sendiri , sebagai berikut:
<span style = "font-size: 14px;"> onpageclicked: function (event, originalEvent, type, page) {// Tampilkan halaman yang sesuai dan ambil item yang baru dibangun terkait dengan halaman yang diklik sebelumnya untuk pengembalian acara var currentTarget = $ (event.currenttarget); switch (type) {case "first": currentTarget.bootstrappaginator ("showfirst"); paging (halaman); merusak; // Kasus halaman sebelumnya "Prev": currentTarget.bootstrappaginator ("showprevious"); paging (halaman); merusak; case "next": currentTarget.bootstrappaginator ("showerext"); paging (halaman); merusak; kasus "terakhir": currentTarget.bootstrappaginator ("showlast"); paging (halaman); merusak; case "halaman": currentTarget.bootstrappaginator ("show", halaman); paging (halaman); merusak; }}, </span>*Hubungi metode halaman (halaman) setelah gaya halaman yang Anda klik. Parameter dalam file sumber halaman di sini sudah tersedia, jadi berikan langsung!
Efek: Saat gaya diubah, langsung gunakan nilai halaman kontrol untuk mengirim permintaan AJAX! Akhirnya, pagination bebas penyegaran diimplementasikan.
Di atas adalah pengetahuan yang relevan yang diperkenalkan oleh editor untuk menggabungkan plug-in paginator paginator bootstrap dengan AJAX untuk mencapai efek pagination bebas penyegaran dinamis. Saya harap ini akan membantu semua orang. Jika Anda memiliki pertanyaan, silakan tinggalkan saya pesan dan editor akan membalas semua orang tepat waktu. Terima kasih banyak atas dukungan Anda ke situs web Wulin.com!