教文館の社内ナレッジベースです。

ブラウザにはオートコンプリート機能があって、ユーザーには便利なのですが、これが商品お問い合わせフォーム(Contact form7)では悪さをします。つまり、商品ページからすでにGETでパラメータを渡されてデータが埋まっている「商品名」「著訳者名」「出版社名」「ISBN」を上書きします。

これを回避するには本来autocomplete属性を付与してやって、「autocomplete=”off”」というふうにパラメータを記述すればいいと書いてありました。

例)

<form method="post" action="/form">
  […]
  <div>
    <label for="cc">クレジットカード番号:</label>
    <input type="text" id="cc" name="cc" autocomplete="off">
  </div>
</form>

これにならって、コンタクトフォーム7上でも次のようにしてみました。ショートコード上なので、記述は”autocomplete:off”となっています。

この結果↓

だめじゃん。_| ̄|○

ChromeだけでなくEdgeでもだめでした。

そこで、ちょっと古い記事の裏技を試してみる。つまりパラメータを”off”でなく任意の文字列にするということ。元ネタではautocomplete=”new-password”としている。仮に「autocomplete:dummy」でやってみます。

元ネタ:フォームの自動補完を無効にするには

その結果がこれ↓

なんとか問題解決。任意の文字列をパラメータとして代入するというトリックでブラウザを欺くそうです。こんなん、裏技やん。解るか!!(# ゚Д゚)

でもやったりました。