<form method="" action="" autocomplete=""></form>

ブラウザ
  • Cr
  • Sf
  • Fx
分類 フロー・コンテンツ / パルパブル・コンテンツ
利用場所 フロー・コンテンツが置ける場所
内容 フロー・コンテンツ(ただし、form要素は含められない)

form要素autocomplete="" を追加すると、オートコンプリート機能(入力内容の自動補完)を有効にするかどうかを指定できます。


<form method="post" action="example.cgi" autocomplete="off"></form>

属性
任意属性
autocomplete="" [+]オートコンプリート on オートコンプリートを有効にする (初期値)
off オートコンプリートを無効にする

autocomplete属性を省略した場合は、オートコンプリート機能が有効になります。

オートコンプリート機能が有効になっている場合は、過去に入力した内容が入力候補として表示されるようになります。(対応しているブラウザのみ)

使用例

オートコンプリートを無効にした例
  • 動作確認のため、送信先としてHTMLファイル(現在のページ)を指定しています。

<form method="get" action="form_autocomplete.html">

<p>オートコンプリートが有効になっているフォーム。</p>
<p>URL:<input type="url" name="example" size="30"></p>
<p><input type="submit" value="送信する"></p>

</form>


<form method="get" action="form_autocomplete.html" autocomplete="off">

<p>オートコンプリートを無効にしたフォーム。</p>
<p>URL:<input type="url" name="example" size="30"></p>
<p><input type="submit" value="送信する"></p>

</form>

表示例

オートコンプリートが有効になっているフォーム。

URL:

オートコンプリートを無効にしたフォーム。

URL:

タイプの異なる入力欄を配置した例
  • 動作確認のため、送信先としてHTMLファイル(現在のページ)を指定しています。また、妥当性のチェックは無効にしてあります。

<form method="get" action="form_autocomplete.html" novalidate>

<p>オートコンプリートが有効になっているフォーム。</p>

<p>テキスト:<br><input type="text" name="example1" size="30"></p>
<p>パスワード:<br><input type="password" name="example2" size="30"></p>
<p>電話番号:<br><input type="tel" name="example3" size="30"></p>
<p>URL:<br><input type="url" name="example4" size="30"></p>
<p>メールアドレス:<br><input type="email" name="example5" size="30"></p>
<p>検索テキスト:<br><input type="search" name="example6" size="30"></p>

<p><input type="submit" value="送信する"></p>

</form>

表示例

オートコンプリートが有効になっているフォーム。

テキスト:

パスワード:

電話番号:

URL:

メールアドレス:

検索テキスト: