Javascript 按字母顺序排序选择菜单？

我有以下选择菜单（）：

汽车
------------
沃尔沃汽车
萨博
梅赛德斯
奥迪

---

使用Javascript，我将如何按字母顺序对列表重新排序，不包括前两个选项（

Cars

和

----

），它们必须保持在顶部？提前感谢您的帮助。

首先，我要为所有要排序的条目提供一个类名，并为选择项提供和ID：

 <select id="sortableCars">
   <option value="volvo">Cars</option>
   <option class="sortMe" value="saab">------------</option>
   <option class="sortMe" value="volvo">Volvo</option>
   <option class="sortMe" value="saab">Saab</option>
   <option class="sortMe" value="mercedes">Mercedes</option>
   <option class="sortMe" value="audi">Audi</option>
 </select>

汽车
------------
沃尔沃汽车
萨博
梅赛德斯
奥迪

至于javascript

 var mylist = $('#sortableCars');
 var listitems = mylist.children('option.sortMe').get();
 listitems.sort(function(a, b) {
    var compA = $(a).text().toUpperCase();
    var compB = $(b).text().toUpperCase();
    return (compA < compB) ? -1 : (compA > compB) ? 1 : 0;
 })
 $.each(listitems, function(idx, itm) { mylist.append(itm); });

var mylist=$（'sortableCars'）；
var listitems=mylist.children（'option.sortMe'）.get（）；
排序（函数（a，b）{
var compA=$（a.text（）.toUpperCase（）；
var compB=$（b.text（）.toUpperCase（）；
返回（compAcompB）？1:0；
})
$.each（列表项，函数（idx，itm）{mylist.append（itm）；}）；

作为一个纯粹主义者，我要说的是，jQuery在任何时候都没有被特别提到或要求，它可能出于某种原因没有在这个项目中使用。下面是一个使用纯javascript的示例

function sortlist(){

 var cl = document.getElementById('carlist');
 var clTexts = new Array();

 for(i = 2; i < cl.length; i++){
    clTexts[i-2] =
        cl.options[i].text.toUpperCase() + "," +
        cl.options[i].text + "," +
        cl.options[i].value + "," +
        cl.options[i].selected;
 }

 clTexts.sort();

 for(i = 2; i < cl.length; i++){
    var parts = clTexts[i-2].split(',');

    cl.options[i].text = parts[1];
    cl.options[i].value = parts[2];
    if(parts[3] == "true"){
        cl.options[i].selected = true;
    }else{
       cl.options[i].selected = false;
    }
 }
}

sortlist();

函数排序列表（）{
var cl=document.getElementById（'carlist'）；
var cltext=新数组（）；
对于（i=2；i

---

更新了不区分大小写。

我的第一种方法与Koolinc的类似，使用Array.prototype.slice将

元素的子节点列表转换为数组。但是，这在Internet Explorer 8及更低版本中不起作用，因此我将其更改为提取、排序，然后重新插入：

var sel = document.getElementsByTagName("select")[0],
    opts = [];

// Extract the elements into an array
for (var i=sel.options.length-1; i >= 2; i--)
    opts.push(sel.removeChild(sel.options[i]));

// Sort them
opts.sort(function (a, b) { 
    return a.innerHTML.localeCompare(b.innerHTML);
});

// Put them back into the <select>
while(opts.length)
    sel.appendChild(opts.shift());

var sel=document.getElementsByTagName（“选择”）[0]，
opts=[]；
//将元素提取到数组中
对于（变量i=sel.options.length-1；i>=2；i--）
选择推送（选择移除child（选择选项[i]）；
//分类
opts.sort（函数（a，b）{
返回a.innerHTML.localeCompare（b.innerHTML）；
});
//把它们放回箱子里
while（选择长度）
sel.appendChild（opts.shift（））；

---

工作演示：

这只是一个基于@Jeff Parker的更通用的answser

function sortSelect(select, startAt) {
    if(typeof startAt === 'undefined') {
        startAt = 0;
    }

    var texts = [];

    for(var i = startAt; i < select.length; i++) {
        texts[i] = [
            select.options[i].text.toUpperCase(),
            select.options[i].text,
            select.options[i].value
        ].join('|');
    }

    texts.sort();

    texts.forEach(function(text, index) {
        var parts = text.split('|');

        select.options[startAt + index].text = parts[1];
        select.options[startAt + index].value = parts[2];
    });
}

功能排序选择（选择，开始）{
if（typeof startAt==“未定义”）{
startAt=0；
}
var文本=[]；
for（var i=startAt；i

---

我还创作了一把小提琴

由于您使用的是mylist.append（）.Close，因此您将以这种方式获得一个包含无序选项和有序选项的select，但是JS在我的测试中并不正常工作。将listitems更改为

$（“#sortableCars>.sortMe”）

并从“-----”选项中删除

sortMe

类解决了我的问题。我修复了它，只选择那些具有“sortMe”类的。有趣的是，你会错过重要的细节……我真的很喜欢使用jQuery，因为它太简单了……这也是它最大的缺点。没有理由增加额外的开销-我会投票支持你的答案。jQuery很棒，我极力主张使用它。。。但是如果有人为了支持这样的东西而不得不将jQuery添加到项目中，我会感到内疚。。。感谢您的信任投票：）这将大写字母置于所有小写字母之前，导致类似于

ABCabc

而不是

AaBbCc

的内容。我做了一点修改，使其尽可能接近大小写中立。请注意，这将不会将

selected

属性保留为正确的选项在列表中显示标题时，您应该考虑使用HTML功能。这样，您就可以按字母顺序排列所有选项，并达到预期效果。如果

的值中包含

|

，则此操作失败。

function sortSelect(select, startAt) {
    if(typeof startAt === 'undefined') {
        startAt = 0;
    }

    var texts = [];

    for(var i = startAt; i < select.length; i++) {
        texts[i] = [
            select.options[i].text.toUpperCase(),
            select.options[i].text,
            select.options[i].value
        ].join('|');
    }

    texts.sort();

    texts.forEach(function(text, index) {
        var parts = text.split('|');

        select.options[startAt + index].text = parts[1];
        select.options[startAt + index].value = parts[2];
    });
}