コメント:単純なHTML関数により、ページが読み込まれた後、必要な要素への入力フォーカスを自動的に見つけることができます。 AutoFocusと呼ばれる属性を介して完成します。興味のある友達はそれについて学ぶことができます。
オリジナルテキスト:HTML5オートフォーカス属性
元のリリース日:2012年8月27日
翻訳時間:2013年8月6日
HTML5は私たちにとって多くの素晴らしいことを発表しました。
過去には、フォーム検証、入力ボックスブランクプロンプト(入力プレースホルダー)、クライアントファイルのアップロードとダウンロード(クライアントサイドファイルの命名)、オーディオ/ビデオ再生など、JavaScriptとFlashで完了したかったタスクを基本的なHTMLで完了することができました。もう1つの簡単なHTML機能により、ページが読み込まれた後に必要な要素への入力フォーカスを自動的に見つけることができるようになり、AutoFocusと呼ばれるプロパティを介して完成させることができるようになりました。
コードは次のように簡単です。
<! - これらはすべて機能します! - >
<input autofocus = "autofocus" />
<button autofocus = "autofocus"> hi!</button>
<textarea autofocus = "autofocus"> </textarea>
AutoFocusプロパティが設定された後、ページのロード後(つまり、焦点を獲得する)後に入力、Textarea、およびボタン要素が自動的に選択されます。他の要素(H1タグなど)、Tabindex = 0を試しましたが、オートフォーカスプロパティはこれらの要素にまったく影響しません。
この属性は、Googleホームページ(ケースの99%が検索に使用される)やオンラインインストールウィザード(WordPressのインストーラーなど)など、主な目的が情報を収集することであるページを取得する主な目的に役立ちます。そして、最も重要なことは、JavaScriptが参加を必要としないことです。
完全なページコードは次のとおりです。
<!doctype html>
<html>
<head>
<Title> HTML5オートフォーカス属性テスト</title>
<メタコンテンツ= "editplus">
<Meta content = "[email protected]">
<Meta content = "original = http://davidwalsh.name/autofocus">
</head>
<body>
<! - 原則として、次の3つの要素のうち1つだけを設定できます。複数の要素が設定されている場合、最後の要素はフォーカスを取得する必要があります - >
<! -
- >
<div>
<input autofocus = "autofocus" />
<button autofocus = "autofocus"> hi!</button>
<textarea autofocus = "autofocus"> </textarea>
</div>
</body>
</html>