HTML5 の autofocus 属性の概要

この記事では主に HTML5 の autofocus 属性を紹介します。これを必要とする友人に共有します。

HTML5 は私たちに多くの魔法をもたらしました。フォームの検証、INPUT プレースホルダー、ダウンロードされたファイルやオーディオ/ビデオのクライアントによる名前変更など、これまで JavaScript と Flash で完了する必要があったタスクはすべて、基本的な HTML を使用して完了できます

ここで説明する単純な HTML5 機能は、ページがロードされるときに入力フォーカスが要素に自動的に置かれるようにします。このアクションは autofocus 属性を使用して完了します。

HTML コードは非常に簡単です:

コードをコピーします

コードは次のとおりです:

<!-- These all work! -->
<input autofocus="autofocus" />
<button autofocus="autofocus">Hi!</button>
<textarea autofocus="autofocus"></textarea>

autofocus 属性を使用すると、ページが読み込まれるときにこれらの INPUT、TEXTAREA、または BUTTON 要素を選択できます。ただし、H1 タグなどの純粋な表示要素を使用する場合、autofocus 属性は使いにくいです。

このプロパティは、状況によっては非常に役立ちます。たとえば、Google のホームページは、ユーザーが 99% の時間の検索に使用する場所であるため、ページが読み込まれたら、カーソルを入力ボックスに置く必要があります。以前はJavaScriptで完結する必要がありましたが、今ではその必要は全くなく、HTMLだけで完結することができます。

以上がHTML5 の autofocus 属性の概要の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。