1

次のようにリストを並べ替えたいと思います。

<ul>
    <li>L</li>
    <li>S</li>
    <li>XXS</li>
    <li>XS</li>
    <li>XL</li>
    <li>L</li>
</ul>

JavascriptとjQueryを使用して、服のサイズの正しい順序を取得しました。私の試みは次のとおりです。

var mylist = jQuery('#filter-size .mana-list');
var listitems = mylist.children('li').get();
listitems.sort(function (a, b) {

    var sizes = new Array();
    sizes = ["XXXS", "XXS", "XS", "S", "S-M", "S-L", "M", "M-L", "L", "L-XL", "XL", "XXL", "XXXL"];

    var compA = jQuery(a).text().toUpperCase();
    var compB = jQuery(b).text().toUpperCase();

    var asize = jQuery.inArray(compA, sizes);
    var bsize = jQuery.inArray(compB, sizes);

    return (asize > bsize) ? -1 : (asize < bsize) ? 1 : 0;
})

私の問題は、inArray（）関数が常に-1を返すことです。何が間違っているのでしょうか。

（注：私は「競合なし」モードでjQueryを使用しています）

よろしくお願いします

4

2 に答える 2

3

コードが不必要に複雑に見えます。

これにより、アイテムのソートされたリストも生成され、比較関数内で使用される高価な DOM (および jQuery) 呼び出しが回避されます。

// get all of the text items, in order, in upper case
var listitems = jQuery('ul').children('li').map(function() {
    return jQuery(this).text().toUpperCase();
}).get();

// keep this outside the function to avoid instantiating it
// every time the comparator is called
var sizes = ["XXXS", "XXS", "XS", "S", "S-M", "S-L", "M",
                 "M-L", "L", "L-XL", "XL", "XXL", "XXXL"];

// just compare the "inArray" values to sort    
listitems.sort(function(a, b) {
    return jQuery.inArray(b, sizes) - jQuery.inArray(a, sizes);
})

比較関数で単純なマイナス演算子を使用していることに注意してください。これは、最大から最小の順に並べ替えます。比較演算子は、「-1、0、1」ではなく、「負、ゼロ、正」のみを生成する必要があります。

注意: これによりページ内の要素が変更されることはありません。それが意図されているかどうかを明確にしてください。

http://jsfiddle.net/alnitak/v3hqB/を参照してください。

于 2012-05-22T16:05:18.247 に答える
0

Alnitakの優れた回答へのフォローアップ。

あなたの並べ替えは大丈夫でした。ディスプレイを更新したい場合は、次のようなもの (簡単に記述) でうまくいきます。

var newList = $('<ul></ul>');
newList.append(listitems);
mylist.replaceWith(newList);

（もっと良い方法があるかもしれません....おそらく一発newListで構築できるでしょうlistitems。）

于 2012-05-22T16:22:24.340 に答える