【HTML】formのオートコンプリートを無効にする

  • このエントリーをはてなブックマークに追加

開発中のWebアプリで、オートコンプリートがバグりました。
DevToolsにも不審なログはなく、関連しそうなCSSを無効化、イベントリスナーの変更なども試しましたが解消せず。

現象が確認できたのはWindows版のChromeのみで、他のブラウザは問題ありませんでしたが、要件を見直してオートコンプリートを無効にすることを決断しました。

そして色々と調べてみると「オートコンプリートは無効化できない」というような記事がざくざく。
無事に無効化できたので、Tipsとして残しておきます。

まずは結論として、無事に無効化できたわけですが、何をどうしたのか。
HTMLに「autocomplete」属性があり、該当のinput要素のautocomplete属性値を「off」に設定しただけです。

<input type="text" autocomplete="off">

ただし、今回は「name」属性が一般的な値ではないなど、いくつかの条件に当てはまったから問題なくできたように思います。
特に、パスワード関連でないことが大きいような印象です。

パスワード欄のオートコンプリートを無効にする場合は、MDN Web Docsにハック等がまとめられていますので、一読することをオススメします。

フォームの自動補完を無効にするには – Web セキュリティ | MDN

  • このエントリーをはてなブックマークに追加

SNSでもご購読できます。

コメントを残す

*