web-dev-qa-db-ja.com

特定の入力でIE10の「クリアフィールド」Xボタンを削除しますか?

確かに便利な機能ですが、無効にする方法はありますか?たとえば、フォームが単一のテキストフィールドで、横に「クリア」ボタンがある場合は、Xも表示するのは無用です。このような場合は、削除するほうが良いでしょう。

それはできますか?できれば、どうですか?

695

ボックスの ::-ms-clear疑似要素 のスタイルを設定します。

.someinput::-ms-clear {
    display: none;
}
1173
Ry-

widthheight0pxに設定するのが良いと思いました。それ以外の場合、IE10はフィールドで定義されているパディングpadding-rightを無視します。これは、入力フィールドにオーバーレイした「X」アイコンの上にテキストが入力されないようにするためのものです。 IE10が内部的に入力のpadding-right::--ms-clear疑似要素に適用していて、疑似要素を隠してもpadding-right値がinputに復元されていないと思います。

これは私にとってはうまくいった:

.someinput::-ms-clear {
  width : 0;
  height: 0;
}
260
jimp

この規則をtext型のすべての入力フィールドに適用するので、後で複製する必要はありません。

input[type=text]::-ms-clear { display: none; }

次のものを使用することで、特定性が低下することさえあります。

::-ms-clear { display: none; }

私はこの答えを追加する前でも後者を使いましたが、ほとんどの人はそれより具体的であることを好むと思いました。両方の解決策はうまくいきます。

95

::-ms-clearhttp://msdn.Microsoft.com/ja-jp/library/windows/apps/hh465740.aspx )にスタイルを設定する必要があります。

::-ms-clear {
   display: none;
}

また、パスワードフィールドの::-ms-reveal擬似要素のスタイルも設定します。

::-ms-reveal {
   display: none;
}
72
ducdhm

ページが互換モードで実行されているときは、すべてのスタイルとCSSベースのソリューションが機能しないことは注目に値します。互換モードレンダラーは、ブラウザにxが表示されていても:: - ms-clear要素を無視します。

ページを互換モードで実行する必要がある場合は、Xが表示されたままになっている可能性があります。

私の場合、私はいくつかのサードパーティ製データバインドコントロールを使用しています、そして私たちの解決策は "onchange"イベントを処理し、フィールドがxボタンでクリアされたらバッキングストアをクリアすることでした。

10
TomXP411