【HTML】form 内で button 要素を押した場合に必ずsubmitしてしまう原因

はじめに

だいぶ初歩的な部分ではありますが、ちょっとハマったのでメモ。

事象

form内にあるbuttonのclickイベント時にjQueryで処理を実行していたが、何らかの別のイベントも発火していたらしく意図した挙動になっていなかった。

原因

form内にあるbuttonでtype属性指定なしだと、submitイベントが発火する仕様があるとのことでそれが原因だった。

<button>ボタン</button>

対策

type属性をbuttonに設定すると、submitイベントが発火しなくなるとのことで解決!

<button type='button'>button ボタン</button>

最後に

割と単純なことではあったが、ハマってしまった。。。

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

CAPTCHA