読者です 読者をやめる 読者になる 読者になる

Webサイト専門プログラマの言いたい放題

元システムエンジニアがサイト制作とプログラミングについて好き放題しゃべります。

【戻るボタンに type="submit" はNG】

コーディングテクニック

f:id:wp-lesson:20160713211906j:plain

問い合せフォームなどの確認ページで
入力ページに戻るボタン。
 

<button type="submit" onclick="history.back();">戻る</button>

これ、Firefoxだとhistory.back(); が効かず
submitされてしまう(送信される)。

<button type="button" onclick="history.back();">戻る</button>

 
これでOK。
 
原因:Firefoxはtypeの指定を優先する

Firefoxの挙動はもっともらしいと考えることもできるけど、
ブラウザによって挙動が違うことに責任を転嫁するのではなく、
目的にあったコーディングをすることが根本的な解決法だと思う。

type="button" はクリックしても何もおきないボタンを表すのだから、
onclickで自分で動作を割り当ててあげる場合に使うのが合理的。

type="submit" は本当にサブミットしなければならない場合に
使うようにするべきだと思う。