ブラウザにフォームの値を覚えさせない

formのinputやselectにvalueやselectedで現在値を入れておいて、変更したい場合ユーザーがいじって送信する、というようなUIを作ろうとしたのですが、Firefoxだと一度フォームの値をいじるとリロードして元に戻そうと思っても編集途中のものが再現されてしまいます。
ブラウザのそういった挙動を止めたい時はその要素の属性に

を設定することで止められます。

デモ:
autocomplete=”on”
autocomplete=”off”
FIrefoxで両者に何か入力してリロードすると違いがわかると思います。

autocompleteはinputやselectに各々設定することもできるし、form要素に指定して全体に反映することもできるようです。

スポンサーリンク

シェアする

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

フォローする