TA貢獻(xiàn)1809條經(jīng)驗(yàn) 獲得超8個(gè)贊
我要做的是：
將每個(gè)文本和值提取<option>到對(duì)象數(shù)組中；
對(duì)數(shù)組排序；
<option>按順序使用數(shù)組內(nèi)容更新元素。
要使用jQuery，您可以執(zhí)行以下操作：
var options = $('select.whatever option');
var arr = options.map(function(_, o) { return { t: $(o).text(), v: o.value }; }).get();
arr.sort(function(o1, o2) { return o1.t > o2.t ? 1 : o1.t < o2.t ? -1 : 0; });
options.each(function(i, o) {
o.value = arr[i].v;
$(o).text(arr[i].t);
});
這是一個(gè)工作的jsfiddle。
編輯 -如果要排序而忽略字母大小寫(xiě)，則可以在比較之前使用JavaScript .toUpperCase()或.toLowerCase()函數(shù)：
arr.sort(function(o1, o2) {
var t1 = o1.t.toLowerCase(), t2 = o2.t.toLowerCase();
return t1 > t2 ? 1 : t1 < t2 ? -1 : 0;
});
TA貢獻(xiàn)1797條經(jīng)驗(yàn) 獲得超6個(gè)贊
接受的答案并非在所有情況下都是最好的，因?yàn)橛袝r(shí)您希望保留選項(xiàng)和不同參數(shù)的類(lèi)（例如data-foo）。
我的解決方案是：
var sel = $('#select_id');
var selected = sel.val(); // cache selected value, before reordering
var opts_list = sel.find('option');
opts_list.sort(function(a, b) { return $(a).text() > $(b).text() ? 1 : -1; });
sel.html('').append(opts_list);
sel.val(selected); // set cached selected value
//對(duì)于ie11或獲得空白選項(xiàng)的用戶，請(qǐng)?zhí)鎿Qhtml（''）empty（）
TA貢獻(xiàn)1784條經(jīng)驗(yàn) 獲得超9個(gè)贊
<select id="mSelect" >
<option value="val1" > DEF </option>
<option value="val4" > GRT </option>
<option value="val2" > ABC </option>
<option value="val3" > OPL </option>
<option value="val5" > AWS </option>
<option value="val9" > BTY </option>
</select>
。
$("#mSelect").append($("#mSelect option").remove().sort(function(a, b) {
var at = $(a).text(), bt = $(b).text();
return (at > bt)?1:((at < bt)?-1:0);
}));
舉報(bào)