6

html タグの属性と同様disableです。<input>

フォームの POST に含まれていないなどの無効化の影響には興味がありません。無効に見えるだけであれば、スタイリングはもちろん css でやり直すことができます。(そして、私の入力フィールドは送信ボタンなので、POST を無効にすることは無関係です。)

クリックできず、無効に見えるようにするだけです。

htmlタグに属性を追加せずに、純粋なcssでそれは可能ですか?

4

4 に答える 4

6

いいえ、CSSだけで機能を無効にすることはできません（スタイリングの目的でのみ存在するため）。ただし、CSSを使用して無効なボタンのようにグレー表示にすることはできます。機能面で無効にするには、JavaScriptを使用する必要があります。

CSSを使用すると、CSSを介してグレー表示されたボタンのスタイルを設定し、その上に別の要素を作成して、ボタンをz-indexより高く設定positionしopactiy、完全に透明にすることができます。これは、実際の要素が有効になっていることを意味しますが、要素が完全に透明であるため、クリックすることはできません。

もう1つの解決策はpointer-events: none;、dom要素のスタイルに追加することです。これは、ほとんどのブラウザーで機能するはずです。

于 2012-06-24T18:42:29.463 に答える
4

あなたは以下の方法で行うことができます...

.input-disable {
  pointer-events: none;
  border: 1px solid grey;
  background-color: lightgrey;
}

input[type=text] {
  height: 30px;
  width: 180px;
  padding: 10px;
}
<input type="text" value="Normal field">
<input type="text" class="input-disable" tabindex="-1" value="disabled field">

于 2018-05-15T11:35:39.813 に答える
1

無効に見えるようにすることはできますが、CSSだけでクリック可能になるのを防ぐことはできません。恐ろしいハックは、divまたは他の要素をオーバーレイすることであり、ボタンはクリックできません。

于 2012-06-24T18:42:21.407 に答える