使用 tinySort 限制子 div？

Question

我正在使用 tinySort 过滤动态创建的子 div，效果很好。但是，我还想限制排序后子 div 的数量。例如.. 只有前 5 个排序的 div。

这是我用来排序的当前代码。

tinysort("#results > div", {
                    order: "desc",
                    attr: 'id'
    });

我想过用这样的东西if (($this).children().length < 5)

但是，我不确定如何将它合并到 tinySort 中，或者这个功能是否已经存在？

如有任何建议或帮助，我们将不胜感激。

DOM结构：

<div id="results" class="results">
 <div id="205" class="results-section">
  <div class="details">
    <h2>115</h2>
     </div>
      <div id="time">
       <h3>7</h3>
   <small>minutes</small>
  </div>
 </div>
<div id="196" class="results-section">
  <div class="details">
    <h2>115</h2>
     </div>
      <div id="time">
       <h3>7</h3>
   <small>minutes</small>
  </div>
 </div>
<div id="180" class="results-section">
  <div class="details">
    <h2>115</h2>
     </div>
      <div id="time">
       <h3>7</h3>
   <small>minutes</small>
  </div>
 </div>
</div>

Answer 1

在我看来，你能做的最好的事情就是在排序后隐藏元素。像这样

$('#results > div').tsort({
    order: "desc",
    attr: 'id'
}).filter(function (i, el) {
    return i > 4; // this way if the other elements need some other style
}).hide();

这里有一个例子http://jsfiddle.net/dhirajbodicherla/9VT8g/23/

或者更简单

$('#results > div').tsort({
    order: "desc",
    attr: 'id'
}).slice(5).hide(); // strictly hide rest except first 5

第二个演示 http://jsfiddle.net/dhirajbodicherla/9VT8g/24/

使用 tinySort 限制子 div？

Limit Child div using tinySort?

javascript

jquery

dom

tinysort