問題
これは説明が難しいので、ご容赦ください。今日解決した奇妙なシナリオに遭遇しましたが、なぜ私の解決策が機能するのかわかりません。
選択のグループを作成し、選択したオプションを他の選択リストから削除することで、同じオプションを複数回選択しないように制限するスクリプトを作成しました。
ただし、IE(IE9を含む)では、オプションリストに間違ったオプションが表示されていましたが、選択すると正しいオプションが表示されました。
エラーを再現する
私の最初のスクリプトでは、次のようにしてこの状態に到達できます。
注: これは IE のみです。Chrome で正常に動作する
スクリプト: http://jsfiddle.net/s6F4h/37/
- 最初のドロップダウンで 3 を選択します
- 2 番目のドロップダウンで 1 を選択します
- 最初のドロップダウンで 1 を選択します (利用可能なオプションではないはずです)。
- 選択された値が 2 であることに注意してください。
- 2 番目のドロップダウンで選択した値を変更すると、提示された値とは異なる値が生成されることに注意してください。
- 最後に、DOM が正しい値を表示していることに注意してください。
エラーを(魔法のように)修正する
さて、ランダムな推測作業で見つけた私の修正について...
スクリプト: http://jsfiddle.net/s6F4h/36/
このように選択を作成すると、奇妙な動作が発生します。
var $S1 = $('<select class="question" />');
このように選択を作成すると、その動作が修正されます。
var $S1 = $('<select />', {'class': 'question'});
ファローアップ
- 上記の 2 つの jQuery オブジェクトの違いは何ですか?
- 一体どのように IE は DOM で 1 つのものを表示し、実際のページで別のものを表示できるのでしょうか (CSSコンテンツがこれを実行できることは知っていますが、CSS は関係ありません)。これが IE6-8 のものであればそれほど悪くはありませんが、IE9 でも再現可能です!
- IE のバグか、jQuery のバグか?
最後に、私は信じられないほど愚かなことをしただけで、ヒステリーの中でばかげた結論をでっち上げたのかもしれません。やさしく、私がそうした場合はお知らせください。