web-dev-qa-db-ja.com

jqueryはオプションの「選択された」属性を削除しますか？

IE8で複数行の選択ボックスのすべてのオプションの選択を解除することができないのはなぜですか？

$("#myselect").children().removeAttr("selected");

回避策はありますか？私が考えることができるもの（attr（ "selected"、 ""）など）は機能していないようです。

更新： 更新されたjsFiddleがあります 私は少なくともが低下しているため、IE8では最初のオプションが選択されています。しかし、ハードコードされたselected = 'selected'andIE8が必要と思われる.attr呼び出しがない場合、Firefoxで3つの異なることを行いますChromeおよびIE8！ このバージョンを参照してください： 、これはシンプルで、動作するはずです：

  • firefoxの場合：何も選択されていません
  • chromeの場合：0番目のオプションが選択されています
  • iE8：最初のオプションが選択された

たぶん私は自分自身を夢中にさせて、そこに私が見ることができないどこかに間違いがありますか？

jqueryinternet-explorer
37
Don Zacharias

これは、jQueryがIE8に変換する方法の一部であり、必ずしもブラウザー自体ではありません。

私は古い学校に行ってjQueryを1行で中断することで回避できました。

document.getElementById('myselect').selectedIndex = -1;
22
radiak

質問は誤解を招くような方法で尋ねられます。 「selected属性の削除」と「すべてのオプションの選択解除」は、完全に異なるものです。

文書化されたクロスブラウザ方式ですべてのオプションを選択解除するには、次のいずれかを使用します

$("select").val([]);

または

// Note the use of .prop instead of .attr
$("select option").prop("selected", false);
66
Jon

これは動作します：

$("#myselect").find('option').removeAttr("selected");

または

$("#myselect").find('option:selected').removeAttr("selected");

jsFiddle

20
Gabe

JQuery 1.9以降を使用：

$("#mySelect :selected").prop('selected', false);
10
Santosh

@radiakの応答に似ていますが、jQueryを使用します（ このAPIドキュメント およびselectedIndexの変更方法に関するコメントを参照）。

$('#mySelectParent').find("select").prop("selectedIndex",-1);

このアプローチの利点は次のとおりです。

  • JQuery内にとどまることができます
  • JQueryセレクター（#mySelectParent例では）
  • より明示的に定義されたコード
  • IE8、Chrome、FFで動作します
2
JJ Zabkar

さて、私はこの問題に多くの時間を費やしました。 Chrome AND IEで動作する答えを得るために、私はアプローチを変更しなければなりませんでした。アイデアは選択されたオプションを削除しないようにします。選択した属性をオプションに追加または設定するのではなく、selectedIndexプロパティを使用して「選択」レベルでオプションを選択します。

前 ：

$('#myselect option:contains("value")').attr('selected','selected');
$('#myselect option:contains("value")').removeAttr('selected'); => KO with IE

後：

$('#myselect').prop('selectedIndex', $('#myselect option:contains("value")').index());
$('#myselect').prop('selectedIndex','-1'); => OK with all browsers

それが役立つことを願っています

1
Pierre

別の選択肢：

$('option:selected', $('#mySelectParent')).removeAttr("selected");

それが役に立てば幸い

1
Eolia