私のページには、サーバー側にデータを渡すために使用される非表示のフォーム フィールドがいくつかあります。デバッグの目的で、各入力フィールドに type=hidden 属性を設定するよりも、すべての入力フィールドを隠しクラスの一部にするだけで、すべての適格な入力フィールドを非表示にする方が簡単だと思います。
デバッグが必要なときはいつでも、そのクラス属性を簡単に変更してデバッグ モードに入ることができます。もちろん、両方のアプローチは入力フィールドを非表示にしますが、このアプローチ (クラスを介して非表示にする) が実際の生活であまり広く使用されていない理由についてはわかりません。どのアプローチを優先すべきかについて、いくつかの光を当てることができますか?
<input type="hidden">入力の検証、オートコンプリート、およびその他のユーザー操作関連のイベントはトリガーされません。ユーザーが直接入力することなく、生データを保存するように設計されています。
しかし<input type="text">、視覚的に隠されている は、依然としてユーザー操作コンポーネントと見なされます。また、視覚補助が有効になっている一部のデバイスでは、非表示ではなく、期待どおりの一貫性を提供できません。そのため、そうすることは好ましくありません。
例えば。<input type="hidden">それ自体をオートコンプリートしたり、ページを更新する前に入力されたデータを保持したり、失敗したタイプの検証のためにフォームが送信されないようにしたりすることはありません。
CSS のアプローチは、使いやすさとアクセシビリティの面で良くありません。CSS が無効になっているユーザー (非常に古い携帯電話、スクリーン リーダーを使用しているユーザー) を考えてみてください。CSS が期待どおりにレンダリングされず、すべての栄光を備えた入力がユーザーに表示されます。
非表示の入力は、暗黙のユーザー入力、つまりユーザーからの入力に使用する必要がありますが、暗黙であり、手動で入力する必要はありません。
あなたの質問は、type="hidden"アプローチに当てはまります。
<input type="hidden" />ユーザーの入力値を保持する HTML の標準的な方法であるため、使用することをお勧めします。に別の属性を使用してtypeで非表示にするとcss、css の読み込みに失敗したときに が表示されるという問題が発生する可能性がありますinput control。
あなたの質問は、フォームフィールドをデバッグするための最良のアプローチについてだと思います。HTMLではtype='hidden'として保持することをお勧めします。これは、あなた、ユーザー、およびページのセマンティック解釈に最適です。
代わりに、Chromeデベロッパーツールなどのツールを使用してデバッグを行ってください。これにより、非表示フィールドの値を簡単に確認できます。