使用javascript/jQuery对选择列表进行排序选项..但不是按字母顺序排序

17

我正在寻找一个函数,可以将下拉列表中的选项列表按字母顺序排序,但是有一个变化。所有值为“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>

缺失值的顺序并不重要。

而且不要问为什么我不能只删除缺失值(或者为什么会有几个具有相同文本但具有不同基础值的选择,因为我也不赞同这种做法)。


值得注意的是,对于所有这些答案:排序将改变所选选项。在排序之前,您必须保留选择元素的值,并在排序后恢复它。 - Steve Clay
4个回答

45

演示: 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');

16
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
    );
}));

1

我对原函数进行了一些更改,它运行得很好。

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');

1
如果页面上有多个选择框(多选框),请使用以下代码:
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));
});

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接