クレジットカード情報の入力ってタイヘンですよね。
たまにしか入力しないから記憶することも難しいので、入力が必要になった時にクレジットカードを探し出して、見ながら入力しなければならず、たまたま出先だったりして『今手元にない』となったりしますよねー。
いや、私の場合は1枚のカードだけは覚えましたので、そういうことは無いんですけど。それでも入力するのは面倒です。
そんな時、一度入力すれば記憶してくれるんです、そう、Chromeならねっ!
ん?なんか違和感のある文章が生まれたぞ。まいっか。

今回の記事は、そのありがたーい自動入力機能が、意図せず動作して困った、というお話です。
百聞は一見に如かず。この画像を見てもらいたい。
スクリーンショット 2022-08-31 194725
table内にフォームパーツを入れているんだけど、1行目に<th>名前</th>として、2行目以降に<input>タグが入っている。
このinputタグが
<input type="text" id="name_1" name="name_1">
<input type="text" id="name_2" name="name_2">
...

というname属性になっている。「name="name"」が良くないのか?ッと思って
<input type="text" id="hoge_1" name="hoge_1">
<input type="text" id="hoge_2" name="hoge_2">
...

としてみるも効果なし。
タチの悪いことに、「autocomplete="off"」は無視されるらしい。実際無視されましたよ。。。
うーん、何で判断しているのか?
<th>名前</th>…まさかね。。と思いつつこれを<th>名称</th>に変更すると…
出ない!
ではこれは?<th>お名前</th>→出た。
どうやら「名前」を含む文字列ならなんでもござれらしい。
「海老名前に行ったことあるぞー」とかでも出る。
スクリーンショット 2022-08-31 180736
ちなみに、海老名は海老名SAに寄ったことがあるような気がする程度です。って、んなこた誰も聞いてない(^_^;)
しかし、「名前」があるだけでカード情報入力と判定してしまうなんて、どうしたんだグーグル様。
だってカード番号らしき入力欄も無いんだよー。どうしてカード情報と思うかなぁ…