3
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

自動入力回避策(仮)

Last updated at Posted at 2019-01-22

とあるサイトを作成中、最後の方でオートコンプリートや自動入力機能に苦戦させられました。
結果的に解決はできなかったものの凌ぐ方法を見つけたので、自分用に忘備録として残しておきます。
本当に一時的なものなので、解決策を探している方はごめんなさい。

#作っていたもの
確認画面ありの文字投稿機能

入力画面→入力確認画面→投稿完了画面

#起きたこと
スマホで「連絡先を自動入力」を押した時に意図しない場所に入力される
→自動入力を押した時にフォーカスしていたフィールドより上に入力されたため、ありえない表示だった。例を挙げるなら、フォーカスしているテキストフィールドより上のテキストフィールドにパスワードが入る、など。

#試したこと
######HTMLにてautocomplete=off
検索をかけて一番多く出てきたが、一切効かず。

######テキストフィールドの名前を変える
テキストフィールドにつけられた名前(nameとか、passwordとか)で推測しているのかと考えたが、これも効かない。

######問題のあるテキストフィールドを非表示にし、ダミーのテキストフィールドを作る
うまくいった。オートコンプリートも効き、ダミーのテキストフィールドにも表示されない。
自動入力時にテキストフィールドを認識する条件に「一番上に存在するTextfield属性のものに対し」というものがあったようで、問題のテキストフィールドに対し、新しいテキストフィールドを上に追加しても、サイト内で一番上にあるテキストフィールドに自動入力が反映されていた。

#結論
時間もなく手っ取り早く仕上げたいならダミーデータを用意するのがおすすめ。

3
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
3
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?