“form”要素~“autocomplete”属性

“autocomplete”属性について

“autocomplete”属性はフォームへの入力時のブラウザーによるオートコンプリートの可否を指定します。

“form”要素に指定された“autocomplete”属性はフォーム全体のオートコンプリートの可否を設定します。特定の入力欄に対する設定はその入力欄を表す“input”要素や“select”要素、“textarea”要素の“autocomplete”属性で指定します。

“input”要素や“select”要素、“textarea”要素の“autocomplete”属性はオートコンプリートの可否だけでなくオートコンプリートで表示されるべき入力候補の種類も指定することができますが、“form”要素に指定された“autocomplete”属性は単純にオートコンプリートの可否のみを設定します。

“autocomplete”属性を省略した時の既定値はオートコンプリートを行う“on”です。

指定できる値

サンプルコード

オートコンプリートを行う

<form method="post" action="sample-formtag6.php" target="_blank" autocomplete="on">

<fieldset>

<legend>あなたの情報</legend>
<p><label>名前：<input type="text" name="name"></label></p>
<p><label>メールアドレス：<input type="email" name="email"></label></p>
<p><label>ウェブサイト：<input type="url" name="website"></label></p>
<p><label>猫が好きです：<input type="checkbox" name="love" required></label></p>

</fieldset>
<p><input type="submit" value="登録する"></p>

</form>

あなたの情報

名前：

メールアドレス：

ウェブサイト：

猫が好きです：

＊送信すると入力内容が表示されます。

オートコンプリートを行わない

<form method="post" action="sample-formtag6.php" target="_blank" autocomplete="off">

<fieldset>

<legend>あなたの情報</legend>
<p><label>名前：<input type="text" name="name"></label></p>
<p><label>メールアドレス：<input type="email" name="email"></label></p>
<p><label>ウェブサイト：<input type="url" name="website"></label></p>
<p><label>猫が好きです：<input type="checkbox" name="love" required></label></p>

</fieldset>
<p><input type="submit" value="登録する"></p>

</form>

あなたの情報

名前：

メールアドレス：

ウェブサイト：

猫が好きです：

＊送信すると入力内容が表示されます。