HTML5 の autofocus 属性の概要

不言
リリース: 2018-05-08 16:02:25
オリジナル
4096 人が閲覧しました

この記事では主に 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 サイトの他の関連記事を参照してください。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート