使用javascript/jQuery在选择列表中排序选项.但不是按字母顺序排列的

Sort Options in a Select List with javascript/jQuery.. but not alphabetically

本文关键字:排列 顺序 选项 jQuery javascript 选择 排序 列表 使用      更新时间:2023-09-26

我正在寻找一个函数,将采取一个选择列表中的选项列表,并按字母顺序排序,但有一个转折。所有带有"NA"文本的值都应该被推到列表的底部。

给定一个列表-

<select>
    <option value="1">Car</option>
    <option value="2">Bus</option>
    <option value="3">NA</option>
    <option value="4">Bike</option>
    <option value="5">Tractor</option>
    <option value="6">NA</option>
</select>

我们应该以-

结束
<select>
    <option value="4">Bike</option>
    <option value="2">Bus</option>
    <option value="1">Car</option>
    <option value="5">Tractor</option>
    <option value="3">NA</option>
    <option value="6">NA</option>
</select>

NAs的顺序不重要。

不要问为什么我不能直接删除NAs(或者为什么会有几个具有相同文本但不同底层值的选项,因为我也不同意它。

演示:http://jsfiddle.net/4bvVz/

function NASort(a, b) {    
    if (a.innerHTML == 'NA') {
        return 1;   
    }
    else if (b.innerHTML == 'NA') {
        return -1;   
    }       
    return (a.innerHTML > b.innerHTML) ? 1 : -1;
};
$('select option').sort(NASort).appendTo('select');
var sb = $('select');
sb.append(sb.find('option').sort(function(a, b){
    return (
        a = $(a).text(),
        b = $(b).text(),
        a == 'NA' ? 1 : b == 'NA' ? -1 : 0|a > b
    );
}));

如果您在页面中有多个选择(多重选择),请使用:

function NASort(a, b) {
    if (a.innerHTML == 'NA') {
        return 1;
    }
    else if (b.innerHTML == 'NA') {
        return -1;
    }
    return (a.innerHTML > b.innerHTML) ? 1 : -1;
};
$('select').each(function( index ) {
    $(this).find('option').sort(NASort).appendTo($(this));
});

我对原来的函数做了一些改变,它工作得很好。

function NASort(a, b) {  
    console.log(a.innerHTML.substr(0, 1).toLowerCase() + ' > ' + b.innerHTML.substr(0, 1).toLowerCase());
    return (a.innerHTML.substr(0, 1).toLowerCase() > b.innerHTML.substr(0, 1).toLowerCase()) ? 1 : -1;
};
$('select option').sort(NASort).appendTo('select');