Question

以下是https://stackoverflow.com/a/37434219/2170109

$(".listitems li").sort(sort_li).appendTo('.listitems');
function sort_li(a, b){
    return ($(b).data('position')) < ($(a).data('position')) ? 1 : ($(b).data('position2')) > ($(a).data('position2')) ? 1 : 0;    
}

如何按第一个属性position排序，然后按第二个position2

排序

我想得到的结果：

Item 24 40549
Item 24 40501
Item 24 40500
Item 3 14801
Item 3 14800
Item 1 90500
Item 0 0
Item 0 0
Item 0 0

Answer 1

你可以这样做

＆＃13;

var sort = $('li').sort(function(a, b) {
  return Number($(b).data('position')) - Number($(a).data('position')) ||
    Number($(b).data('position2')) - Number($(a).data('position2'))
});

$('ul').empty().append(sort)

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul class="listitems">
  <li data-position="24" data-position2="40500">Item 24 40500</li>
  <li data-position="1" data-position2="90500">Item 1 90500</li>
  <li data-position="0" data-position2="0">Item 0 0</li>
  <li data-position="0" data-position2="0">Item 0 0</li>
  <li data-position="0" data-position2="0">Item 0 0</li>
  <li data-position="3" data-position2="14800">Item 3 14800</li>
  <li data-position="3" data-position2="14801">Item 3 14801</li>
  <li data-position="24" data-position2="40501">Item 24 40501</li>
  <li data-position="24" data-position2="40549">Item 24 40549</li>
</ul>

＆＃13;

Answer 2

您的代码基于字符串比较工作，而不是基于数字的排序进行减法。

$(".listitems li").sort(sort_li).appendTo('.listitems');

function sort_li(a, b) {
  // get the diff of `data-position`
  var diff = $(b).data('position') - $(a).data('position');
  // return the difference if it's not 0
  // else return the difference of `data-position2`
  return diff == 0 ? $(b).data('position2') - $(a).data('position2') : diff;
  // although you can use Logical Short-Circuit Evaluation
  // return $(b).data('position') - $(a).data('position') || $(b).data('position2') - $(a).data('position2');
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<ul class="listitems">
  <li data-position="24" data-position2="40500">Item 24 40500</li>
  <li data-position="1" data-position2="90500">Item 1 90500</li>
  <li data-position="0" data-position2="0">Item 0 0</li>
  <li data-position="0" data-position2="0">Item 0 0</li>
  <li data-position="0" data-position2="0">Item 0 0</li>
  <li data-position="3" data-position2="14800">Item 3 14800</li>
  <li data-position="3" data-position2="14801">Item 3 14801</li>
  <li data-position="24" data-position2="40501">Item 24 40501</li>
  <li data-position="24" data-position2="40549">Item 24 40549</li>
</ul>

如何按两个属性排序 - jQuery

2 个答案: