JQuery-Paging-Plugin, das mit einer seltsamen Seitenstruktur funktioniert

Question

Ich habe ein jQuery-Plugin zu unseren Websites hinzugefügt, das derzeit wie gewünscht funktioniert, aber nicht funktioniert, wenn sich zwei Elemente auf der Seite befinden, die gepaginated werden müssen. Ich habe den Entwickler des Plugins darauf angesprochen, und er bestätigt, dass es nur für ein Element auf der Seite ausgelegt ist.

Also habe ich nach einem anderen Pager-Plugin gesucht, aber alle, die ich gefunden habe, können nicht mit meinem speziellen Anwendungsfall umgehen.

Mein Anwendungsfall ist wie folgt. Ich habe eine Reihe von Listen, die als Spalten fungieren. Auf Seite eins möchte ich die ersten beiden Listenelemente beider Spalten sehen.

In dem aktuellen Pager habe ich dies umgesetzt, indem ich die Anzahl der Spalten berechne und den regulären Start / Ende durch sie teile, sodass anstelle von Datensätzen 1 - 4 Datensätze 1 - 2 angezeigt werden. Mit dem :nth-child-Selektor zeigt jQuery dann das erste und zweite li-Element von entweder ul an. (Wenn Sie nach Code suchen: http://pastebin.com/F7BqQaxh)

Dies ist nur möglich, weil das spezielle jQuery-Plugin, das ich verwendet habe, eine anpassbare Callback-Funktion verwendet, die ausgeführt wird, wenn der Benutzer auf eine Seitennummer klickt. Dies funktioniert jedoch nicht, wenn sich mehr als ein Element auf der Seite befindet, da die Callback-Funktion nicht weiß, auf welches der beiden Pager-Elemente geklickt wird - oder ich übersehe einfach etwas Grundlegendes.

Also. Ich denke, ich suche nach einem einfachen Pager-Plugin, das mit mehreren Elementen auf derselben Seite funktioniert (und mit einem .each() -Aufruf funktionieren sollte, damit ich den Pager auf alle Elemente mit einer 'paged' -Klasse anwenden kann) / und / das eine überladbare Methode hat, um mein benutzerdefiniertes Verhalten zu implementieren.

Ic#m in JavaScript bei weitem nicht ausreichend (oder geduldig) genug, um es alleine zu entwickeln, obwohl es einfach genug sein sollte. Ich kämpfe einen ganzen Tag lang mit ein paar Zeilen Code, und JS im Allgemeinen frustriert mich einfach zu sehr. Aber jemand muss es tun, :(.

Answer 1

Das Pajinate Plugin wird tun, was du brauchst. Du kannst das DIV definieren, in dem es sitzen soll, und es ohne Probleme aufrufen:

$(function(){
  $(".pajinate").pajinate({
    item_container_id:'.pajinate-content', 
    nav_panel_id:'.navigation',
    items_per_page:3,
  });
});

      a
      b
      c
      d
      e
      f
      g
      h
      i
      j
      k
      l

      a
      b
      c
      d
      e
      f
      g
      h
      i
      j
      k
      l