HTML フォーム コントロールの無効な属性の読み取り専用と無効の概要

HTML フォーム コントロールの無効な属性の読み取り専用と無効の概要

HTML でフォームの送信を無効にする方法は 2 つあります。

1. コントロールタグにreadonly='readonly'属性を追加します。

2. コントロールタグにdisabled='disabled'属性を追加します。

例えば:

<input type="text" value="" readonly="読み取り専用" /> 
<input type="text" value="" disabled="無効" />

例のコントロールは両方とも編集できません。しかし、違いもいくつかあります。

文字通りの意味から、readonly 属性を持つコントロールは「読み取り専用」であり、disabled 属性を持つコントロールは「無効」であることがわかります。では、それらの違いは何でしょうか?

ユーザーは、マウスやキーボードを使用して読み取り専用コントロール (readonly 属性を使用するコントロール) の値を変更することはできませんが、プログラマーは JavaScript を使用して変更できます。フォームが送信されると、コントロールの名前と値がサーバーに送信され、サーバーに表示されるようになります。

無効なコントロール(disabled 属性を持つコントロール)は、ユーザーがマウスやキーボードで変更できず、サーバーからも見えません。つまり、フォームを送信しても、その名前と値はサーバーに送信されません。もちろん、プログラマーは JavaScript を使用して値を変更することもできます。

これがその違いです。違いを知った上で、どの方法をいつ使うべきかを知り、盲目になってはいけません。

要約する

これで、HTML フォーム コントロールの無効な属性の読み取り専用と無効の違いに関するこの記事は終わりです。HTML 読み取り専用無効の関連コンテンツについては、123WORDPRESS.COM の以前の記事を検索するか、次の関連記事を引き続き参照してください。今後とも 123WORDPRESS.COM を応援していただければ幸いです。

<<:  JSON.parse と JSON.stringify の使い方の詳細な説明

>>:  MySQLとOracleのメタデータ抽出例分析

推薦する

Vue プロジェクトに Electron を追加するための詳細なコード

1. package.jsonに追加する "メイン": "electr...

HTML 再利用テクニック

HTML の再利用は、あまり話題に上らない言葉です。今日は、この問題を次のようにまとめたいと思います...

CSSで特殊なグラフィックを描く方法

1. 三角形境界線の設定 コード: 幅: 300ピクセル; 高さ: 300px; 背景: 赤; 境界...

シンプルなウェブ計算機を実装するJavaScript

背景私は新しいプロジェクト チームに配属されたので、プロジェクトでは js を使用する必要があります...

Server-U 14バージョンのインストールと使用方法

Server-Uソフトウェアの紹介Server-U は非常に強力なファイル マネージャーです。FTP...

Vue実戦記録のログインページの実装

目次1. 事前準備1.1 Node.jsをインストールする1.2 webpackをインストールする1...

Vueライフサイクルの違いの詳細な説明

ライフサイクル分類vue の各コンポーネントは独立しており、各コンポーネントには独自のライフサイクル...

ページ内にマーキーとフラッシュが共存する場合の競合解決

競合の主な症状は、FLASH ボタンがジャンプし続け、不安定になり、Web ページの外観と通常のアク...

docker ログ - docker コンテナ ログの実装を表示します

docker logs コマンドを使用してコンテナ ログを表示できます。コマンド形式: $ dock...

CSS クロスブラウザ スタイルのバグのデバッグについて

まず最初に、適切なブラウザを選択します。私が Chrome を選択したのは、その強力なデバッグ ツー...

ページのレンダリング時間を短縮してページの実行速度を速めます

ブラウザでのページのレンダリング時間をできるだけ短縮するにはどうすればよいでしょうか? この記事は、...

iframe を通じて DOM 要素のサイズ変更を監視する

開発プロセス中によく発生する問題は、div のサイズ変更をどのように監視するかということです。たとえ...

純粋なテキストとアイコン付きのボタンを実現するための HTML+CSS

この記事では、いくつかの基本的なページ要素の実装方法をまとめており、後で更新される予定です。まず、私...

CSSは半透明の境界と複数の境界のシーン分析を実現します

シナリオ 1:半透明の境界線を実現するには: CSS スタイルのデフォルトの動作により、背景色はコン...

Vue スキャフォールディングでのレンダリングを理解する

Vue スキャフォールディングでは、エントリ ファイル main.js の新しい Vue コードに、...