Readonly と Disabled_HTML/Xhtml_Web ページ制作の微妙な違いの詳細な説明

Readonly と Disabled のどちらも、ユーザーがフォーム フィールドの内容を変更できないようにすることができます。ただし、それらの間にはわずかな違いがあり、それらを要約すると次のようになります:

Readonly は入力 (テキスト/パスワード) とテキストエリアに対してのみ有効ですが、disabled はすべてのフォーム要素に対して有効ですが、フォーム要素が disabled を使用した後は, POST または GET 経由でフォームを送信する場合、この要素の値は渡されませんが、readonly は値を渡します (readonly は値の変更を受け入れ、それを返すことができ、disable は変更を受け入れますが、データは返しません)。

一般に一般的な状況は次のとおりです。

一意の識別コードがユーザーのフォームに事前に入力されており、ユーザーはそれを変更することはできませんが、変更する場合は値を渡す必要があります。そのプロパティを読み取り専用に設定する必要があります。

ユーザーがフォームを正式に送信し、管理者による情報の検証を待つ必要がある場合、ユーザーはフォーム内のデータを変更することはできず、表示のみが可能であることがよくあります。広範囲の無効な要素があるため、この時点では無効を使用する必要がありますが、同時に送信ボタンも無効にする必要があることに注意してください。それ以外の場合は、ユーザーがこのボタンを押している限り、このボタンが存在します。データベース操作ページで整合性チェックを行わないと、データベース内の値がクリアされます。この場合、無効ではなく readonly を使用しても、フォーム内に input (text/password) 要素と textarea 要素しかない場合は、select などの他の要素がある場合でも、ユーザーは値を書き換えて押すことができます。 Enter キーを押して送信します (Enter はデフォルトの送信トリガー キーです)

ユーザーが送信ボタンを押した後、JavaScript を使用して送信ボタンを無効にすることがよくあります。これにより、ユーザーが送信ボタンを使用できなくなる可能性があります。ネットワーク状態が悪い環境でユーザーが送信ボタンを繰り返しクリックすると、データがデータベースに重複して保存されます。

disabled と readonly の 2 つの属性には共通点があります。たとえば、両方が true に設定されている場合、js コードを記述するときにこれら 2 つの属性を混合するのは簡単です。

入力項目の無効化が true に設定されている場合、フォーム入力項目はフォーカスを取得できず、すべてのユーザー操作 (マウスのクリックやキーボード入力など)入力項目が無効になりますが、最も重要な点は、フォームが送信されるときに、このフォーム入力が送信されないことです。
Readonly は、テキストを入力できるテキスト入力ボックスなどの入力項目のみに使用されます。true に設定すると、ユーザーは対応するテキストを編集できなくなりますが、フォーカスすることはでき、フォームを送信するときに入力項目が使用されます。フォームの送信として。