2012-03-19 4 views
2

このコードはIEではうまく動作しないようですが、私はそれをしてはいけないと言ったものは見つかりませんでした。 私は何が間違っていますか?あなたが合格IE内のsort()関数

​<ul id="cars"> 
    <li id="2">Ford</li> 
    <li id="1">Volvo</li> 
    <li id="3">Fiat</li> 
    </ul> 



var list = $('#cars').children('li'); 
    list.sort(function(a,b){ 
     return parseInt(a.id) < parseInt(b.id); 
    }); 
    $('#cars').append(list); 

+0

これはjQuery関数です。少なくとも、バージョン1.3.2のjQueryライブラリを含んでいますか? –

+1

それは他のブラウザでも動作すると言っていますか? – Beska

+0

@Coryいいえ、そうではありません。 https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Array/sort – Blazemonger

答えて

7

ソート機能は、AがBの後に来る(ゼロ未満の数(AがBの前に来る)、0(a、bは等価である)、0以上のいずれかを返す必要があります)。

あなただけのこの操作を行う場合は、それが動作するはずです:

return parseInt(a.id) - parseInt(b.id); 

ものparseIntに基数の引数に渡すように傷つけることができない、それは少し安全です:

return parseInt(a.id, 10) - parseInt(b.id, 10); 
+2

必ずparseIntのradix引数を渡してください。転ばぬ先の杖。 – Blazemonger

+0

常に基数を渡してください!何か理由が必要な場合は、 'parseInt(" 09 ")' – Archer

+0

を試してみてください。あなたはa-bではなくb-aを処理する必要があると思います。 – Blazemonger

2

それは正しくないと考えられていますHTML4で数字でIDを開始します。これはブラウザではめったに問題を引き起こさないが、簡単に避けることもできる。

IDをdata-の属性に置き換えました。この属性は、jQueryの.data()メソッドによって自動的に抽出され、数字に変換され、parseIntの必要はありません。

HTML:

<ul id="cars"> 
    <li data-val="2">Ford</li> 
    <li data-val="1">Volvo</li> 
    <li data-val="3">Fiat</li> 
</ul> 

JS:

$('#cars').children('li').sort(function(a, b) { 
    return $(a).data('val')-$(b).data('val'); 
}).appendTo('#cars');​​​​​ 
​ 

フィドル:あなたがHTML要素に任意のデータを添付したいときhttp://jsfiddle.net/qaytJ/1/

data-属性が有用であり、それはより多くの "正しい" ですまたは少なくともより適切な方法で、idまたはclassに、意図しないジョブを実行させることができます。それらを頻繁に使用してください。