ホームページ > ウェブフロントエンド > H5 チュートリアル > HTML5のautofocus属性の使い方を詳しく解説

HTML5のautofocus属性の使い方を詳しく解説

黄舟
リリース: 2017-03-14 15:40:12
オリジナル
2341 人が閲覧しました

この記事では主に HTML5 の autofocus 属性 の使い方を詳しく紹介します。興味のある方は参考にしてください

HTML5 は私たちに多くの魔法をもたらしました。フォーム検証、INPUT プレースホルダー、ダウンロードされたファイルのクライアント側の名前変更、

オーディオ/ビデオなど、以前はJavaScriptとFlashが必要だったタスクはすべて、基本的なHTMLを使用して実行できます。ここで説明する簡単な HTML5 機能は、ページが読み込まれるときに入力フォーカスが要素に自動的に置かれるようにすることです。このアクションは autofocus 属性を使用して実行されます。

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

XML/HTML Code复制内容到剪贴板
<!-- 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 までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート