0

IE8 で 2 つのドロップダウン ボックスの 1 つが正しく機能しないという問題が発生しています。Firefox、Chrome、Safari、および IE9+ では正常に動作しますが、何らかの理由で IE8 が動作しません。

基本的に、上部のドロップダウン ボックスをクリックして選択内容を表示できますが、マウスを下に移動してオプションを選択するとすぐにドロップダウンが消えます。オプションをすばやく選択できる場合もあれば、矢印キーを使用するとオプションを適切に選択できる場合もあります。一番下のボックスは問題なく完全に機能しますが、これは本当に奇妙です.

また、ドロップダウン ボックスをフォームの上部 (他の入力フィールドの上) に移動すると、ドロップダウンをダブルクリックしてオプションを選択できるようになるため、わずかに改善されますが、まだ完全ではありません。

さらにテストした後、私が使用しているこれらの CSS トグル ボタンに問題がある可能性があるようです: http://ghinda.net/css-toggle-switch/これらも正しく表示されないためです (IE8 はすべてのスタイリングを無視しています)。

私が十分に明確でなかったら申し訳ありません。サイトはまだ公開されていないのでお見せできませんが、私が使用しているコードは次のとおりです。

<label class="control-label">Dropdown2</label>
<div class="controls">
  <select class="m-wrap" style="width: 100px; margin-left: 4px; margin-top: 4px;" id="option1" onChange="QuoteRefresh();" tabindex="1">
    <option value="">Select...</option>
    <option value="1">1</option>
    <option value="5">2</option>
    <option value="2">3</option>
    <option value="3">4</option>
    <option value="6">5</option>
    <option value="4">6</option>
  </select>
</div>
<label class="control-label">Dropdown 2</label>
<div class="controls">                                      
  <select class="m-wrap" style="width: 100px; margin-left: 4px; margin-top: 4px;"  id="option2" onChange="QuoteRefresh();" tabindex="1">
    <option value="">Select...</option>
    <option value="1000">1000</option>
    <option value="2000">2000</option>
    <option value="3000">3000</option>
    <option value="4000">4000</option>
    <option value="5000">5000</option>
  </select>
</div>

HTML から次のコードを削除したところ、問題は解決しました。このコードは、上記のトグル ボタンに関連しています。ただし、ドロップダウンを操作するには、これらのトグル ボタンが必要です。

  <div class="switch candy blue">
    <input id="op1" name="sat" type="radio">
    <label for="op1" onClick="">Yes</label>
    <input id="op2" name="sat" type="radio" checked>  
    <label for="op2" onClick="">No</label>
    <span class="slide-button"></span>
  </div>
4

1 に答える 1

0

選択要素を使用してIE8でこの正確な問題が発生しました。クリックするとオプションが表示されましたが、オプションを選択するために移動すると、オプションが消えました。

私にとっての問題はCSS3 PIEでした。CSS3 PIE が非常に一般的に使用されているという理由だけで、この回答を提供すると思いました。私の場合、古いブラウザーで select 要素の角を丸くするために使用していました。

CSS3 PIE の「動作」を追加したセレクターを削除するとすぐに、問題は解消されました。IE8 の選択要素に丸みを帯びた境界線はなくなりましたが、実際に機能するようになりました。

于 2014-05-05T10:25:27.850 に答える