リファレンス

【HTML】<input> 要素 autocomplete 属性に指定できる値まとめ

 
この記事では、<input>要素textarea要素select要素の autocomplete 属性に指定できる値をまとめています。

autocomplete 属性には、ブラウザによる自動補完機能を使用するかどうかを指定することができますが、文字列や数値を返さない入力型には効果がありません。

また、実際の動作はブラウザによって異なりますので、ご注意ください。
 

autocomplete 属性を指定できる input 要素

 
 

autocomplete 属性に指定できる値

on自動補完を使用する。
off自動補完を使用しない。
名前name名前
honorific-predix敬称・肩書など(Mr, Mrs, Dr など)
given-name名(ファーストネーム)
additional-nameミドルネーム
family-name苗字(ラストネーム)
honorific-suffix名前の後ろに敬称(様, Ⅱ, Jr など)
nicknameニックネーム
usernameユーザーネーム
メールアドレスemailメールアドレス
パスワードnew-password新しいパスワード
current-password現在のパスワード
one-time-codeユーザー確認に使用されるワンタイムコード
組織organization企業・団体・組織名
organization-title組織内での肩書・役職(社長、専務など)
住所street-address住所の番地など
address-line1住所の番地などを3つに分けたもので、street-address がある場合に使用できます。
address-line2
address-line3
address-level4address-level3 よりも後ろにつく住所の末尾
address-level3市区町村名の後ろにつく町名など
address-level2市区町村名
address-level1都道府県名
country国コード
country-name国名
postal-code郵便番号
クレジットカードcc-nameクレジットカード支払者の名前
cc-given-nameクレジットカード支払者の下の名前(ファーストネーム)
cc-additional-nameクレジットカード支払者のミドルネーム
cc-family-nameクレジットカード支払者の苗字(ラストネーム)
cc-numberクレジットカード番号
cc-expクレジットカードの有効期限
cc-exp-monthクレジットカード有効期限の月
cc-exp-yearクレジットカード有効期限の年
cc-cscクレジットカードのセキュリティコード
cc-typeクレジットカードの種類(Visa, JCB, Master Card など)
決済transaction-currency支払い通貨
transaction-amount支払額
language言語
生年月日bday生年月日
bday-day生年月日の日の部分
bday-month生年月日の月の部分
bd-year生年月日の年の部分
sex性別
電話番号tel電話番号
tel-country-code電話番号の国コード
tel-national国番号を含まない電話番号
tel-area-code市外局番
tel-local国番号や市外局番を含まない電話番号
tel-extension内線番号
imppIMPP(Instant Message and Presence Protocol・インスタントメッセージプロトコル)の URL
urlホームページやウェブサイトなどの URL
photo画像の URL

 
 

参考:HTML の autocomplete 属性 – MDN web docs

ABOUT ME
Sara
「わかりやすく・シンプル」をモットーに、スマホアプリ・ウェブアプリの作り方を紹介します。 独学でプログラミングを勉強をしている方、基礎は勉強したけれど次に何をすれば良いか分からない...という方のお役に立てるサイトを目指しています🙂
独学は難しそうと感じたら

 
独学でプログラミングを勉強するのは難しそう、効率的にプログラミングを学びたいという方はオンラインスクールがオススメです。

オンラインスクールを選ぶときのポイント

  • 無料体験があること
  • 個別サポートがあること

自分にあったスタイルを見つけるために、無料体験のご利用をオススメします。(無料体験後に自分には合わないなと感じたらハッキリ断ってしまって問題ありません。)
 
個別サポートもプログラミング学習に挫折しないために重要なポイントです。エラーや困った時にすぐに個別対応をしてくれるスクールを利用して下さい。

ここでは3つのオンラインスクールを紹介します。
全て無料体験がありますので、ぜひ自分に合ったスクールを見つけてみて下さい????
 

1. TechAcademy(テックアカデミー)

オンライン完結で勉強できるスクールで、コースがとても充実しています。チャットで質問すればすぐに回答を得られるのが一番のおすすめポイントです。
オリジナルのサービスやアプリの開発もサポートしてくれるので、開発したいものが決まっている人にもオススメです。

無料体験はこちら

2. CodeCamp(コードキャンプ)

一対一で受講できる個別指導のプログラミングスクールです。
Webデザイン・Webサービス開発・アプリ開発などを幅広く学習することができます。
マンツーマンなので自分のペースで学習できて、質問もその都度できるのがメリットです。

無料体験レッスンはこちら

3. Treehouse

英語でも良い、英語とプログラミングを同時に勉強したいという方は Treehouse がオススメです。月25ドルで始めることができて、たくさんのプログラミング言語を学ぶことができます。
個別サポートはありませんが、掲示板が充実しています。ほとんどの場合、質問してから30分程度で回答を得ることができます。

7日間の無料体験はこちら

guest
0 Comments
Inline Feedbacks
View all comments
0
この記事にコメントするx