formでonsubmitする2つの方法

同じ内容のことを2つの方法でやる(サンプルコードあり)

1.formのonsubmit属性で行う

onsubmit属性にて実行したい関数を設定。送信の動作をキャンセルするためには、return falseを追記する。
※なぜreturn falseをすると良いのかは別途調べる。

lesson15 (forked) - CodeSandbox

lesson15 (forked) by hippopo-moo using parcel-bundler

2.addEventListnerで行う

form要素に対してイベントリスナーを登録する。addEventLitenerのコールバック関数に実行したい関数をセットする。
送信の動作をキャンセルするためには、コールバック内で受け取ったeventに対してpreventDefaultする。

lesson15 - CodeSandbox

lesson15 by hippopo-moo using parcel-bundler

私がJavaScriptを教えていただいている『もりけん塾』の森田先生の情報はこちら。
BLOG:無骨日記
Twitter:@terrace_tech

Follow me!

コメントを残す

メールアドレスが公開されることはありません。