jQueryでselect要素内のoption要素を並び替えしたいのですが、
並び替えは問題なくできるのですが
何故かoption要素でselectedが複数指定されているとselectedの情報が上手く取得できません。
selectedが１つの場合は何故か問題なく取得できます。
問題の解決策あれば教えて頂けますか。

(function($) {
  $(function() {
    var options = $("#sortThis2 option");  
    var arr = options.map(function(i, o) {
      return {
        text: $(o).text(),
        val: o.value,
        sel: o.selected //true || false
      };
    }).get();

    arr.sort(function(o1, o2) {
      return o1.text > o2.text ? 1 : o1.text < o2.text ? -1 : 0;
    });
    options.each(function(i, o) {
      o.value = arr[i].val;
      $(o).text(arr[i].text);
      o.selected = arr[i].sel;
      if (o.selected) {
          $(o).attr("selected",true);
      } else {
          $(o).attr("selected",false);
      }
    });

  });
})(jQuery);

追記複数のselectedが指定されているのではなく、以下のhtml文の場合も選択できませんでした。
どのような問題が考えられるのでしょうか。

html

<select id='sortThis2'>
<option value=''>-リセット-</option>
<option value='20160823'>2016年08月23日</option>
<option value='20160822'>2016年08月22日</option>
<option value='20160824'>2016年08月24日</option>
<option value='20160820' selected>2016年08月20日</option>
<option value='20160819'>2016年08月19日</option>
<option value='20160818'>2016年08月18日</option>
</select>

退会済みユーザー

2016/08/25 03:35 編集

「> selectedの情報が上手く取得できません。」とありますが、具体的にコードのどの部分のことか、というのと、どうなるべきところどうなった、という情報もあった方がいいと思います。

yambejp

2016/08/25 05:46

jQuery側で指定する「#sortThis」と例示のHTMLのid「sortThis2」は一致していませんが大丈夫でしょうか？

行動規範の内容に同意します

回答2件

見た感じ動いているようですが

HTML
1<select id="sortThis" multiple size=5>
2<option value="val3" selected>text3</option>
3<option value="val2">text2</option>
4<option value="val5" selected>text5</option>
5<option value="val1">text1</option>
6<option value="val4">text4</option>
7</select>
8

追記

ちなみに、今回は直接関係ありませんが三項演算を二重に使用するのは危険です。
どうしても書かなくてはいけないなら論理式ごとにカッコで囲んでください

javascript
1//本来はこう
2function(o1, o2) {
3if(o1.text === o2.text) return 0;
4return (o1.text > o2.text ) ? 1 :-1;
5}
6
7//カッコで囲むならこう
8function(o1, o2) {
9 return (o1.text > o2.text) ? 1 : ((o1.text < o2.text) ? -1 : 0);
10}