4

我想按计算的小数值对以下选择选项进行排序，不包括 --please select-- 选项。

<select class="wpsc_select_variation">
<option value="0">-- Please Select --</option>
<option value="13">1"</option>
<option value="21">2''</option>
<option value="11">3/4"</option>
<option value="6">3/8"</option>
<option value="10">5/8"</option>
<option value="17">1-1/2''</option>
<option value="15">1-1/4''</option>
<option value="19">1-3/4''</option>
<option value="7">1/2"</option>
</select>

到目前为止我整理的代码：为简洁起见，添加到 pastebin 中。

关联

这可以解释注释 1 数组的长度为 3。但为什么是 3？为什么不是9？为什么Chrome显示全数组，但长度还是3，而Firefox点击父+后显示全数组，父却说undefined, option, option？

使困惑...

编辑：编辑以允许多个选择框：如果我错了，请纠正我。

$(".wpsc_select_variation").each(function(index, element){
        $($(element).children().get().sort(function (a, b) {
        return parseInt(a.value) - parseInt(b.value);
        })).appendTo($(element));
    });

使用对象的最新编辑。开始：

var els = new Array();
var counter = 0;
$j("select.wpsc_select_variation option").each(function(index, ele){
var obj = new Object;
var i = $j(ele).text();
i = i.replace("\"", "");
i = i.replace("''", "");
if (i.indexOf("-") >= 0){
    i = i.split('-');
    split = i[1].split('/');
    i = eval(i[0]) + split[0] / split[1];
}
else if(i.indexOf("/") >= 0){
    split = i.split('/');
    i = split[0] / split[1];
}
i = eval(i);
obj.ind = i;
obj.ele = ele;
els[counter] = obj;
counter++;
});
els.sort(function (a, b) { return parseInt(a.ind) - parseInt(b.ind) });
console.log(els);

上述结果：

[Object { ind=NaN,  ele=option}, Object { ind=0.75,  ele=option}, Object { ind=0.375,  ele=option}, Object { ind=0.625,  ele=option}, Object { ind=0.5,  ele=option}, Object { ind=1,  ele=option}, Object { ind=1.5,  ele=option}, Object { ind=1.25,  ele=option}, Object { ind=1.75,  ele=option}, Object { ind=2,  ele=option}]

它似乎在某种程度上对它们进行了排序，但正如您所看到的，它们仍然是乱序的。

4

2 回答 2

2

由于选项值已经按照您需要的顺序排列，您可以对它们进行排序：

$($(".select_variation option").get().sort(function (a, b) {
    return parseInt(a.value) - parseInt(b.value);
})).appendTo(".select_variation");
于 2013-02-14T01:51:24.157 回答
0

下面的 jsfiddle 解决了这个问题。感谢 ExplosionPills 的一般帮助和 Kolink 帮助我发现更多关于数组的信息。感谢这里的 vol7ron：
Turning a array of jquery objects into html以获取他对函数的帮助。多谢你们！

function sortByRationalValue (a,b){
        return a.rationalValue - b.rationalValue;
    }
function returnObjectFromMeasurements(element, text) {
    var obj = {},
        range = text.replace(/["'”″]/g, '').split('-'),
        rational;

    if (range.length > 1)
        rational = eval(range[0]) + eval(range[1]);
    else
        rational = eval(range[0]);

    obj.rationalValue = rational;
    obj.element       = element;
    return obj;
}
jQuery(document).ready(function( $ ) {
    $(".wpsc_select_variation").each(function (index, element) {
        var els = new Array();
        var counter = 0;
        var children = $(element).children();
        $(children).each(function (index, ele) {
            els[index] = returnObjectFromMeasurements(ele, $(ele).text());
        });
        els.sort(sortByRationalValue);
        var elements = new Array();
        $.each(els, function (index, value) {
            elements[index] = value.element;
        });
        $(this).html(elements);
    });
});

http://jsfiddle.net/vwWJ3/5/

于 2013-02-15T15:40:26.513 回答