ReadonlyとDisabledのわずかな違いについて説明します。
2022-01-10 15:33:55
ReadonlyとDisabledは、どちらもユーザーがフォームフィールドの内容を変更できないようにするために使用することができます。しかし、両者には細かな違いがあり、それをまとめると以下のようになります。
/{br
readonly は input(text / password) と textarea に対してのみ有効で、disabled はすべてのフォーム要素に対して有効です。しかし disabled を使用した後、POST または GET でフォームを送信する場合、この要素の値は渡されませんが、readonly は値を渡します (readonly は値の変更を受け付け、それを戻すことができます。disable は変更を受け付けるがデータを戻しません。) 。
一般的に多いのは、このケースです。
ユーザーに対して一意の識別子があらかじめ入力されており、ユーザーがそれを変更することができないが、その値で送信する必要があるフォームでは、そのプロパティを読み取り専用に設定する必要があります。
ユーザーが正式にフォームを送信し、管理者の情報検証を待つ必要がある場合、ユーザーはフォーム内のデータを変更することができず、閲覧のみ可能であるということがよくあります。 ボタンで、データベース操作ページで整合性チェックが行われないと、データベース内の値はクリアされます。この場合、disabledの代わりにreadonlyを使用すると、フォームにinput(text / password)とtextarea要素しかない場合でも可能で、selectなど他のヘアー要素がある場合は、ユーザーが値を書き換え、エンターキーを押して送信できます(エンターはデフォルトで送信トリガーキーです)。
ユーザーが送信ボタンを押した後、送信ボタンを無効にするためにjavascriptを使用することがよくあります。これにより、ネットワークの状態が悪いときにユーザーが何度も送信ボタンをクリックして、データベースにデータが重複して保存されることを防いでいます。
/{br
disabledとreadonlyの2つのプロパティには共通点があり、例えば両方ともtrueに設定するとフォーム属性が編集できなくなるなど、jsコードを書く際にこの2つのプロパティを混在させやすいことがあります。
入力のdisabledがtrueに設定されると、フォーム入力はフォーカスを得ることができず、すべてのユーザーアクション(マウスクリック、キーボード入力など)はその入力に対して無効となります。
trueに設定すると、ユーザーは対応するテキストを編集できないだけで、フォーカスすることは可能で、フォーム送信時には、その入力はフォーム項目の1つとして送信されます。
/{br
readonly は input(text / password) と textarea に対してのみ有効で、disabled はすべてのフォーム要素に対して有効です。しかし disabled を使用した後、POST または GET でフォームを送信する場合、この要素の値は渡されませんが、readonly は値を渡します (readonly は値の変更を受け付け、それを戻すことができます。disable は変更を受け付けるがデータを戻しません。) 。
一般的に多いのは、このケースです。
ユーザーに対して一意の識別子があらかじめ入力されており、ユーザーがそれを変更することができないが、その値で送信する必要があるフォームでは、そのプロパティを読み取り専用に設定する必要があります。
ユーザーが正式にフォームを送信し、管理者の情報検証を待つ必要がある場合、ユーザーはフォーム内のデータを変更することができず、閲覧のみ可能であるということがよくあります。 ボタンで、データベース操作ページで整合性チェックが行われないと、データベース内の値はクリアされます。この場合、disabledの代わりにreadonlyを使用すると、フォームにinput(text / password)とtextarea要素しかない場合でも可能で、selectなど他のヘアー要素がある場合は、ユーザーが値を書き換え、エンターキーを押して送信できます(エンターはデフォルトで送信トリガーキーです)。
ユーザーが送信ボタンを押した後、送信ボタンを無効にするためにjavascriptを使用することがよくあります。これにより、ネットワークの状態が悪いときにユーザーが何度も送信ボタンをクリックして、データベースにデータが重複して保存されることを防いでいます。
/{br
disabledとreadonlyの2つのプロパティには共通点があり、例えば両方ともtrueに設定するとフォーム属性が編集できなくなるなど、jsコードを書く際にこの2つのプロパティを混在させやすいことがあります。
入力のdisabledがtrueに設定されると、フォーム入力はフォーカスを得ることができず、すべてのユーザーアクション(マウスクリック、キーボード入力など)はその入力に対して無効となります。
trueに設定すると、ユーザーは対応するテキストを編集できないだけで、フォーカスすることは可能で、フォーム送信時には、その入力はフォーム項目の1つとして送信されます。
関連
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
HTML要素の高さ、offsetHeight、clientHeight、scrollTopなどについて説明します。
-
htmlはテーブルの幅が無効な問題を解決する
-
ウェブフロントエンドにおける小さなベクターアイコンの使用について
-
HTML基本構造包括的理解
-
html ハイパーリンクスタイル(4つの状態)設定例
-
input type=text value=str で不完全な解答を得る。
-
HTMLでJavaScriptを使用するためのコード例
-
テーブルの背景画像を設定しても、100%表示できない解決方法
-
自分たちの力でIE6を絶滅に追い込む
-
純粋な html ページで送信、パラメータ渡し、ID 確認を行う方法