Question

想要通过它的选项文本对html select进行排序。

$(function() {
        var options = $('#buybox select[name="group[2]"] option');

        var arr = options.map(function(_, o) {
            return {
                t: $(o).text(),
                v: o.value
            };
        }).get();

        arr.sort(function(a, b) {
            //return a.t > b.t ? 1 : a.t < b.t ? -1 : 0;// numeric
            var sizes = { "XS" : 0 , "S" : 1, "M" : 2, "L" : 3, "XL" : 4, "2XL" : 5};
            console.log(sizes);
            console.log(a.t);
            console.log(b.t);
            console.log(sizes[a.t]);
            console.log(sizes[b.t]);
            return sizes[a.t] > sizes[b.t] ? 1 : sizes[a.t] < sizes[b.t] ? -1 : 0;
        });

        options.each(function(i, o) {
            o.value = arr[i].v;
            $(o).text(arr[i].t);
        });


    });

数字排序工作正常。但属性名称a.t和b.t未定义。这里有什么问题？

感谢

HTML选择

    select name="group[2]" onchange="this.form.submit();" style="width: 300px;">
<option selected="selected" value="7">L</option>
<option value="8">XL</option>
<option value="9">2XL</option>
<option value="35">M</option>
</select>

Answer 1

你让它变得复杂很多

var sizes  = ["XS", "S", "M", "L", "XL", "2XL"],
    select = $('#buybox select[name="group[2]"]');

$('option', select).sort(function (a, b) {
    return sizes.indexOf($(a).text()) - sizes.indexOf($(b).text());
}).appendTo(select);

FIDDLE

为什么这种排序功能不起作用？

1 个答案: