javascript - 我需要将 jpages 与排序 javascript 结合起来

Question

我正在尝试使用 jpage ( http://luis-almeida.github.io/jPages/js/jPages.js ) 为我的网页进行分页。我喜欢在分页之前对元素进行排序。

我使用“时间戳”来排序顺序，23,22,21,20.....等等。

但我当前的代码仅重新排列同一页面中的项目。示例:

1. 第 1 页:32、23、21、20....
2. 第 2 页:45、21、19、16....

等等。

我怎样才能让它在分页之前对顺序进行排序，这样我就可以获得结果:

1. 第 1 页:45、32、23、21、21....
2. 第 2 页:20、19、16....

https://jsfiddle.net/salyyy/zvyhbd8t/15/

<div id="itemContainer">  

<li class="col-xs-6 col-sm-6 col-md-4" timestamp="3">
                this is test1
            </li>

      <li class="col-xs-6 col-sm-6 col-md-4" timestamp="38">
                this is test2
            </li>

      <li class="col-xs-6 col-sm-6 col-md-4" timestamp="11">
                this is test3
            </li>

      ....

      </div>

      <div class="holder"></div>

$(document).on('ready', function() {

    /* initiate plugin */
    $("div.holder").jPages({
      containerID: "itemContainer",
      minHeight: false,
      perPage:12,
      callback    : function( pages, items ){
        $("#itemContainer").each(function(){
            $(this).find('li').sort(function(a, b) {
            var count = 0;
                // convert to integers from strings
            a = parseInt($(a).attr("timestamp"), 10);
            b = parseInt($(b).attr("timestamp"), 10);
            count += 2;
            // compare
            if(a < b) {
                return 1;
            } else if(a > b) {
                return -1;
            } else {
                return 0;
            }
            }).appendTo(this);
        });
      }
    });
  });

Answer 1

回调函数在分页之后执行，因此需要在分页之前进行排序并更新 DOM，

 $("#itemContainer").html(
       $("#itemContainer").children("li").sort(function (a, b) {

         a = parseInt($(a).attr("timestamp"), 10);
         b = parseInt($(b).attr("timestamp"), 10);

          return b - a
       });
    );

然后应用分页，<​​/p>

$("div.holder").jPages({
    containerID: "itemContainer",
    minHeight: false,
    perPage:12
});

fiddle :https://jsfiddle.net/u1b08nr7/