如何使用JavaScript对带有数字的字符串选择框进行排序

我试图对Select选项数组进行排序，但这些选项在字符串末尾包含一个数字。那么，我如何不仅按开头字母排序，而且按数字排序呢

<select id="DueOn">
    <option value="**SelectValue**">Enter custom value</option>
    <option value="1182" >Business Day - 1</option>
    <option value="1199" >Business Day - 10</option>
    <option value="1801" >Business Day - 12</option>
    <option value="1285" >Business Day - 15</option>
    <option value="1198" >Business Day - 2</option>
    <option value="1232" >Calendar Day - 4</option>
    <option value="1191" >Calendar Day - 5</option>
    <option value="1306" >Calendar Day - 7</option>
    <option value="1782" >Calendar Day - 9</option>
    <option value="1757" >Day of the Week Day - Friday</option>
    <option value="1770" >Day of the Week Day - Wednesday</option>
</select>

输入自定义值
工作日-1
营业日-10
营业日-12
营业日-15
工作日-2
日历日-4
日历日-5
日历日-7
日历日-9
星期五
星期三

我将其修改为运行，并按字母顺序排序：

function sortSelect(selElem) {
    var tmpAry = new Array();
    for (var i=0;i<selElem.options.length;i++) {
        tmpAry[i] = new Array();
        tmpAry[i][0] = selElem.options[i].text;
        tmpAry[i][1] = selElem.options[i].value;
    }
    tmpAry.sort();
    console.log(tmpAry )
    while (selElem.options.length > 0) {
        selElem.options[0] = null;
    }
    for (var i=0;i<tmpAry.length;i++) {
        var op = new Option(tmpAry[i][0], tmpAry[i][1]);
        selElem.options[i] = op;
    }
    return;
}
sortSelect(document.querySelector("#DueOn"))

功能排序选择（selElem）{
var tmpAry=新数组（）；
对于（变量i=0；i 0）{
sellem.options[0]=null；
}
对于（var i=0；i如果您有一个一致的分隔符（比如您的示例中的
“-”
），您可以对其进行拆分，这样就只剩下一个字符串和一个数字

如果字符串相同，则按数字进行比较

如果字符串不相同，请使用标准排序逻辑


const daysOfWeek=[“周日”、“周一”、“周二”、“周三”、“周四”、“周五”、“周六”]；
//创建一个可重用的排序函数，该函数接受select元素
常量排序选择选项=（选择）=>{
让选项=select.options；
让sortedOptions=[…options].sort（（a，b）=>{//比较a和b
a=a.text；//我们只关心文本，不关心值
b=b.文本；
让aParts=a.split（“-”）//在“-”处将文本分成两段
设bParts=b.split（“-”）；
//如果第一部分相同，我们将比较第二部分
//但是我们需要知道它们是字符串还是数字
如果（aParts[0]==bParts[0]&&aParts.length>1&&bParts.length>1）{
a=一部分[1]；
b=b部分[1]；
}
//特殊分拣箱
//数字
如果（！isNaN（a））a=数字（a）；
如果（！isNaN（b））b=编号（b）；
//一周中的几天
如果（daysOfWeek.indexOf（a）>=0）a=daysOfWeek.indexOf（a）；
如果（daysOfWeek.indexOf（b）>=0）b=daysOfWeek.indexOf（b）；
//基本分类
如果（ab）返回1
否则返回0；
});
//更新选择列表中的每个选项
用于（分类索引）
select.options[index]=sortedOptions[index]；
};
//获取“DueOn”选项，并使用我们的新函数对其进行排序
const select=document.getElementById（“DueOn”）；
sortSelectOptions（选择）；

输入自定义值
工作日-1
营业日-10
营业日-12
营业日-15
工作日-2
日历日-4
日历日-5
日历日-7
日历日-9
星期五
星期三
您需要一个自定义比较功能：


功能排序选择（selElem）{
var tmpAry=新数组（）；
对于（变量i=0；i 0）{
sellem.options[0]=null；
}
对于（var i=0；i我使用了基本示例，并使用了javascript提供的数组，您的需求已经完全满足，请查看代码片段并运行它


var选项=[“工作日-15”、“工作日-1”、“工作日-12”、“星期五”、“工作日-2”、“日历日-4”、“工作日-10”、“日历日-7”、“日历日-9”、“星期三”、“日历日-5”]；
options=options.sort（）；
var select=document.getElementById（'selectTag'）；
options.forEach（函数（值）{
select.options[select.options.length]=新选项（值，select.options.length）；
})

-挑选-
这是一个非常常见的要求，已经为其构建了一个排序算法：

a.localeCompare(b, 'en-u-kn-true');

根据英语（
en
）中带有数字排序（
u-kn-true
）的
a
在
b
之前还是之后，返回负值、0或正值。
tmpAry.sort（）
，因此为其指定一个：

tmpAry.sort((a, b) => a[0].localeCompare(b[0], 'en-u-kn-true'));

tmpAry
的元素本身就是数组，因此您需要使用
[0]
s在文本上进行比较。
localeCompare
是一种字符串方法，而不是数组方法

不必重建所有的
，您可以将它们移动到排序位置。如果节点已经存在于DOM中，则将移动节点。由于您已经在使用自定义排序函数，您可以从每个
中提取
文本内容
，并直接按其排序。不再需要提取文本和值e单独，因此
tmpAry
可以包含原始
s：


功能排序选择（selElem）{
const tmpAry=[…sellem.options]；
tmpAry.sort（（optionA，optionB）=>optionA.textContent.localeCompare（optionB.textContent，'en-u-kn-true'）；
for（tmpAry的const选项）{
sellem.appendChild（选项）；
}
}
sortSelect（document.querySelector（“DueOn”）；

输入自定义值
工作日-1
营业日-10
营业日-12
营业日-15
工作日-2
日历日-4
日历日-5
日历日-7
日历日-9
星期五
星期三
请共享您的排序代码。请提供排序代码，以便我们可以进一步处理
值
与我假设的文本内容之间没有逻辑关联？您是正确的，请使用设置了数字标志的localeCompare查找，或者查看自然排序算法。您按字符串排序。您的结果看起来是正确的唯一原因是的，因为你的数字是按字母顺序排列的订单。尝试添加一些两位数的数字。现在看一下，我用所需的数据更新了代码，并且它现在突出了我提到的问题。例如，你有
工作日-2
在
工作日-15
之后。耶，好的，我知道了，似乎问题不错，我会给你回复还没有工作的了不起的家伙在第二个工作日之前还有第十个工作日…老兄，谢谢你。我要学习你是怎么做的