0

私は EXT.Js フレームワークを使用していますが、IE9 で問題が発生しました (IE8 および以前のバージョンではすべて正常に動作します)。クリックすると、すべてのチェックボックスの近くに点線の境界線が表示されます。メインのcssファイルに設定しようとしました:

body.ext-ie input{
    outline: none;
}

しかし、うまくいきません。

チェックボックスに関連付けられたラベルについてだと思いますが、それを修正する方法がよくわかりません。

私の問題の例:

赤で示した間違った動作

このチェックボックスを生成する ExtJs コードは次のとおりです。

{
    fieldLabel: 'XXXX XXXX',    
    name: 'XXXX',                
    xtype: 'checkbox',    
    disabled: !isXXXXX}

css ファイルはここから入手できます: css file

更新 1

ExtJS ファイルを次のように修正しました: JS:

items [{
    fieldLabel: 'xxx',    
    name: 'xxx',                
    xtype: 'checkbox', 
    style: {outline: 'none'}, 
    onfocus: function() {this.style.outline = "none"; }
 }]

次の html を生成します。

<div class="x-form-check-wrap" id="ext-gen271" style="width: 180px;">
  <input type="checkbox" autocomplete="off" id="ext-comp-1161" name="persistentRecoveryEnabled" class=" x-form- 
 checkbox x-form-field" style="outline: none;" checked="">
  <label for="ext-comp-1161" class="x-form-cb-label" id="ext-gen272">&nbsp;</label>
</div>

Document モード Quirks モード (Page default) では、"x-form-cb-label" の周りに点線が表示されます。

ドキュメント モードでは IE9 標準の点線はこの設定では表示されません。

CSS の変更はまったく役に立ちません。

したがって、2 つの質問があります。

  1. class="x-form-cb-label"JS経由でスタイルを設定するには?
  2. ドキュメントモードIE9標準をJS経由でページデフォルトとして設定する方法は? (htmlはExtJSで生成)
4

3 に答える 3

1

はい、ご想像のとおり、それはあなたの分野のoutline周りです。label

を非表示にするコードが機能しoutlineない理由は、ラベルではなくフィールドのアウトラインを指定しているためです。

(あなたが私たちに示したコードを考えると、なぜそれが言うのではなく空白なのだろうかXXXX XXXX?)

非表示にする場合は、次labelの代わりにセレクターとして使用する必要がありinputます。

label {
    outline: 0;
}

ただし、その前に、現在選択されているフィールドを囲む点線のアウトラインが一部のユーザーにとって重要な機能であることを指摘しておく価値があります。特に、マウスを使用できない障害のあるユーザーは、キーボードを使用してサイトをナビゲートするときにマウスに依存しており、ページのどこにいるかを知ることができます。

非表示にすると、それらのユーザーを積極的に差別することになります。(サイトの視聴者によっては、これは特に重要ではないかもしれませんが、一部の国では違法であることに注意してください)

于 2013-03-28T17:27:01.840 に答える
0

これを試して

label:focus
{
    outline:none;
}
于 2013-03-29T17:07:15.793 に答える