按数据属性按字母顺序排序列表项，然后按数字排序

我想从A-Z 然后 0-9排序此列表。按数据属性按字母顺序排序列表项，然后按数字排序

<ol class="columns"> 
    <li data-char="y">y</li> 
    <li data-char="1">1</li> 
    <li data-char="a">a</li> 
    <li data-char="e">e</li> 
    <li data-char="c">c</li> 
    <li data-char="w">w</li> 
    <li data-char="0">0</li> 
    <li data-char="9">9</li> 
    <li data-char="g">g</li> 
</ol> 

$(".columns li").sort(sort_li).appendTo('.columns'); 

function sort_li(a, b){ 
    return ($(b).data('char')) < ($(a).data('char')) ? 1 : -1; 
}

看了类似的问题，这是我想出来的，但它只适用于数字或字母（不是两个）。 https://jsfiddle.net/qLta1ky6/

来源

2015-07-12 ditto

的数字ASCII码比字母小，所以只是简单地做比较，这样当增加体重对他们说：

$(".columns li").sort(sort_li).appendTo('.columns'); 

function sort_li(a, b){ 
    var va = $(a).data('char').toString().charCodeAt(0); 
    var vb = $(b).data('char').toString().charCodeAt(0); 
    if (va < 'a'.charCodeAt(0)) va += 100; // Add weight if it's a number 
    if (vb < 'a'.charCodeAt(0)) vb += 100; // Add weight if it's a number 
    return vb < va ? 1 : -1; 
}

Updated JSFiddle here

来源

2015-07-12 08:25:05

干得漂亮，比我的更有效的解决方案。 – Theodore

谢谢@Theodore我其实也会使用'isNaN'，但我认为只是简单地使用ASCII码就不那么复杂了。 –

出于好奇，我附加了非英文字符以及非ASCII字符，它的工作非常好，https://jsfiddle.net/qLta1ky6/4/。再次，很好地完成队友！ – Theodore

有规律的排序过程将首先映射的数值。我的想法是关于排序，然后处理数组以达到所需的结果。

var items = $('.columns li').get(); 
items.sort(function(a,b){ 
    var keyA = $(a).attr("data-char"); 
    var keyB = $(b).attr("data-char"); 

    if (keyA < keyB) return -1; 
    if (keyA > keyB) return 1; 
    return 0; 
}); 

//split the array to integers and alphanumerics 
var nums = [], alphas = []; 
$.each(items,function(i,v){ 
    if(isNaN(parseFloat($(v).attr("data-char")))) 
     alphas.push(v) 
    else 
     nums.push(v) 
}); 

items = alphas.concat(nums) 

var ul = $('.columns'); 
$.each(items, function(i, li){ 
    ul.append(li); 
});

Demo

来源

2015-07-12 08:25:20 Theodore

按数据属性按字母顺序排序列表项，然后按数字排序

回答

相关问题