【JS】フォーム送信時にリロードしない方法
Table of Contents
ぜひ読んでほしい方
・HTMLフォーム送信時にリロードせずにJS関数を呼び出したい
Formタグにonsubmit要素を加える方法
HTMLフォーム送信時にリロードしない方法は主に2つあり、一つは今から説明するonsubmit要素を使う方法、もう一つは後述する実行するJS関数の最後にreturn falseを記述する方法です。
一つ目の紹介するやり方は、以下のコードのように<form>タグにonsubmit要素を加えてreturn false を指定するやり方です。
1 2 3 |
//hogehoge();は実行したいJS関数 <form onsubmit="hogehoge(); return false;"> </form> |
こうすることで、hogehoge()というフォーム送信時に呼び出すJS関数を実行した後で、return falseがきくため、結果としてリロードせずにJS関数を実行できます。
JS関数内にreturn falseを記述する方法
二つ目の方法は、以下のコードのように実行するJS関数の最後にreturn falseを記述するやり方です。
1 2 3 4 5 6 |
const hogehoge = () => { //任意の処理 ... ... return false } |
こうすると今度は、JS関数の一通りの処理が終わった最後のところでreturn falseが実行されるので、結果として一つ目の方法と同様にリロードせずにJS関数を実行できます。