我有这个 dom:
<ul id="appsList">
<li><span>some value</span> <span>android</span></li>
<li><span>some value</span> <span>ios</span></li>
<li><span>some value</span> <span>facebook</span></li>
<li><span>some value</span> <span>android</span></li>
<li><span>some value</span> <span>ios</span></li>
<li><span>some value</span> <span>android</span></li>
<li><span>some value</span> <span>android</span></li>
</ul>
我想按我得到的数组对列表项进行排序:
数组可以是:[ios,android,facebook]
和它的任何其他组合,不一定包含所有键,可以只是 [ios]
。
我希望列表按数组排序,所以如果我在其中有 [ios,android,facebook]
那么列表将按如下方式排序:
<ul id="appsList">
<li><span>some value</span> <span>ios</span></li>
<li><span>some value</span> <span>ios</span></li>
<li><span>some value</span> <span>android</span></li>
<li><span>some value</span> <span>android</span></li>
<li><span>some value</span> <span>android</span></li>
<li><span>some value</span> <span>android</span></li>
<li><span>some value</span> <span>facebook</span></li>
</ul>
最佳答案
更新:
例如:
<li><span>some value</span> <span class="sort">android</span></li>
并使用.find("sort")
你必须调整 .sort()
函数,
var arr = ['ios','android','facebook'] ;
var $li = $('#appsList li').sort(function(a,b) {
var firstValue = $(a).find('.sort').text();
var secondValue = $(b).find('.sort').text();
var first = arr.indexOf(firstValue);
var second = arr.indexOf(secondValue);
var output = (second === -1 && first > -1) ? -1 :
(second > -1 && first === -1) ? 1 :
(second === -1 && first === -1) ? firstValue > secondValue :
(second > first ? 1 : -1);
return output;
});
$('#appsList').html($li);
示例片段。
var arr = ['ios','android','facebook'] ;
var $li = $('#appsList li').clone().sort(function(a,b) {
var firstValue = $(a).find('.sort').text();
var secondValue = $(b).find('.sort').text();
var first = arr.indexOf(firstValue);
var second = arr.indexOf(secondValue);
var output = (second === -1 && first > -1) ? -1 :
(second > -1 && first === -1) ? 1 :
(second === -1 && first === -1) ? firstValue > secondValue :
(second > first ? 1 : -1);
return output;
});
$('#resultAppsList').html($li)
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
Before sort :
<ul id="appsList">
<li><span>some value</span> <span class="sort">android</span></li>
<li><span>some value</span> <span class="sort">ios</span></li>
<li><span>some value</span> <span class="sort">facebook</span></li>
<li><span>some value</span> <span class="sort">android</span></li>
<li><span>some value</span> <span class="sort">ios</span></li>
<li><span>some value</span> <span class="sort">android</span></li>
<li><span>some value</span> <span class="sort">android</span></li>
</ul>
After sort :
<ul id="resultAppsList">
</ul>
关于javascript - Jquery按数组中的元素值排序,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37907429/