Bootstrap Paginator Paging Plugin -Download -Adresse:
Download Vissit -Projekt in GitHub Download
1. Dies ist die JS -Funktion, die auf der Seite platziert werden muss, die paginiert werden muss:
<span style = "Schriftgröße: 14px;"> Funktion Paging (Seite) {$ .ajax ({type: "get", url: "$ {ctx}/api/v1/user/1/"+(Seite)+"/5", Datentyp: "JSON", Erfolg: Funktion (msg) {{.... // Omit (Querius Out Data)} ({{....../omit (omit) (query out Data); $ .ajax ({type: "get", url: "$ {ctx}/api/v1/user/count/1", datatype: "json", Erfolg: Funktion (msg) {var pages = math.ceil (msg.data/5); // Die Gesamtmenge der Daten in den Daten. Bootstrapmajorversion: 3, aktuelle Seite: Seite, // Die aktuellen Seitennummer von Pagen: 5, // Die verschiedenen Schaltflächen werden auf einer Seite angezeigt (5 LIS werden in UL) Gesamtpagne erzeugt: Seiten // Gesamtzahl der Seiten} Element.bootStrappaginator (Optionen); } </span>Seite:
<span style = "Schriftgröße: 14px;"> <ul id = "pageul"> </ul> </span>
*Es wird automatisch in li generiert
2. Die wichtigste und zentralste Sache ist, die Quelldatei von Bootstrap-paginator.js wie folgt zu ändern :
<span style = "Schriftgröße: 14px;"> OnPageClicked: Funktion (Ereignis, OriginalEvent, Typ, Seite) {// Die entsprechende Seite anzeigen und das neu erstellte Element, das sich auf die vor dem Ereignis return var currentarget = $ (Ereignis.CurrentTarget) geklickte Seite bezieht. Switch (Typ) {case "first": currentTarget.bootStrappaginator ("showfirst"); Paging (Seite); brechen; // Vorherige Seite Fall "prev": currentTarget.bootStrappaginator ("showprevious"); Paging (Seite); brechen; Fall "Weiter": currentTarget.bootStrappaginator ("zeigtext"); Paging (Seite); brechen; Fall "letztes": CurrentTarget.bootStrappaginator ("Showlast"); Paging (Seite); brechen; Fall "Seite": currentTarget.bootStrappaginator ("Show", Seite); Paging (Seite); brechen; }}, </span>*Rufen Sie die Methode der Seite (Seite) nach dem von Ihnen geklickten Seitenstil an. Die Parameter in der Seitenquellendatei sind hier bereits verfügbar. Geben Sie sie also direkt weiter!
Effekt: Wenn der Stil geändert wird, verwenden Sie direkt den Seitenwert des Steuerelements, um die AJAX -Anfrage zu senden! Schließlich wird die erfrischungsfreie Pagination implementiert.
Das obige ist das relevante Wissen, das vom Editor eingeführt wurde, um das Bootstrap-Paginator-Paging-Plug-In mit AJAX zu kombinieren, um einen dynamischen Aktualisierungsfreien-Paginationseffekt zu erzielen. Ich hoffe, es wird für alle hilfreich sein. Wenn Sie Fragen haben, hinterlassen Sie mir bitte eine Nachricht und der Editor wird allen rechtzeitig antworten. Vielen Dank für Ihre Unterstützung auf der Wulin.com -Website!