form 内にある button をクリックしても更新しない方法

HTML のイメージ。

button 要素が form 要素内に含まれるとき、出力されたボタンをクリック(タップ)すると、 submit(post) が実行され、ブラウザはページを更新(あるいはリダイレクト)してしまいます。

form 要素の外に出すと HTML 構造が崩れてしまう場合、button 要素に type="button" 属性を追加します。

button 要素の標準の type 属性は submit です。したがって、何も指定していないとき、 出力されたボタンをクリック(タップ)すると、その form 内にある情報をサーバーに送信する処理が実行されてしまいます。

一方で button を指定しておけば、単にボタンとして扱われるので、例えば JavaScript の関数を実行するためなどに button 要素を使うことができます。