Question

我正在尝试this solution整理下拉菜单，但在选项中有两位数，14和11位于8和9之前。

我该如何处理？

我的代码如下：

<select id="test">
    <option>Size 9</option>
    <option>Size 14</option>
    <option>Size 8</option>
    <option>Size 11</option>
</select>

$("#test").html($("#test option").sort(function (a, b) {
    return a.text == b.text ? 0 : a.text < b.text ? -1 : 1;
}))

我需要一个解决方案来排序下拉，即使只有字符，而不是混合。

jsfiddle

Answer 1

您可以使用以下代码段，btw将为每个选项设置值：

DEMO jsFiddle

$("#test").html($("#test option").val(function(){
    return this.text.match(/\d+/);
}).sort(function (a, b) {
    var a = parseInt(a.value,10), b = parseInt(b.value,10);
    return a < b ? -1 : 1;
}));

或者没有设定值：

DEMO

$("#test").html($("#test option").sort(function (a, b) {
    var a = parseInt(a.text.match(/\d+/),10), b = parseInt(b.text.match(/\d+/),10);
    return a < b ? -1 : 1;
}));

编辑：（以下评论）

您可以跳过排序默认选项，如下所示：

DEMO

$("#test").html($("#test option").val(function (i) {
    return i !== 0 ? this.text.match(/\d+/) : this.value;
}).sort(function (a, b) {
    var a = parseInt(a.value !== ""?a.value:-1, 10),
        b = parseInt(b.value, 10);
    return a < b ? -1 : 1;
}));

Answer 2

您可以按值排序

HTML

<select id="test">
    <option value='9'>Size 9</option>
    <option value='14'>Size 14</option>
    <option value='8'>Size 8</option>
    <option value='11'>Size 11</option>
</select>

JS

$("#test").html($("#test option").sort(function (a, b) {
    return parseInt($(a).val()) == parseInt($(b).val()) ? 0 : parseInt($(a).val()) < parseInt($(b).val()) ? -1 : 1;
}));

DEMO

Answer 3

比较文本两个文本字段时，包含一些数字。 比较仅适用于第一个数值。

例如：如果我们将大小9与大小14进行比较，那么你可以获得令人惊讶的结果，例如大小9大于大小14.这是因为只有第一个数值被比较所以对于14，这个值是数字值为1.

在您的情况下，一个简单的解决方案可能是将值字段应用于选项并使用值进行比较。

<select id="test">
    <option value ="9">Size 9</option>
    <option value ="14">Size 14</option>
    <option value ="8">Size 8</option>
    <option value ="11">Size 11</option>
</select>

$("#test").html($("#test option").sort(function (a, b) {
    return parseInt(a.value,10) == parseInt(b.value,10) ? 0 : parseInt(a.value,10) < parseInt(b.value,10) ? -1 : 1;
}))

排序下拉选项

3 个答案: