今回はContact Form 7で送信ボタンをクリックしたときの処理をキャンセルして任意の処理で止める方法を解説します。
送信前に任意の処理を入れてから送信処理を行うのではなく、送信処理そのものをキャンセルして任意の処理で止めます。
送信処理をキャンセルして任意の処理で止める方法
以下のように書けばokです。
$(function () {
$('input[type="submit"]').click(function () {
// 任意の処理
return false; // ←これだけ
});
});
// 以下でもok
document.addEventListener('wpcf7mailsent', function () {
// 任意の処理
return false; // ←これだけ
});return falseを入れる。これだけです！
Contact Form 7の送信処理自体を止めているのでクリックしても送信処理が行われることはありません。
逆にこれを入れないと任意の処理を入れてもContact Form 7の送信処理が行われてしまい、任意の処理で止めることができないので注意しましょう。
wpcf7mailsentというイベントはContact Form 7に用意されているイベントでフォーム送信時に発火します。ここでもreturn falseを入れるを入れることで送信処理を無効化できます。
ちなみに他にもイベントはいくつかあるので気になる人は公式ドキュメントを見てみてください。
＞＞DOM イベント
まとめ
送信前に任意の処理を入れて送信するやり方は結構あったのですが、送信処理をせずに任意の処理で止めるやり方はあまり書いてなかったのでほぼ自分用ですが書いておきました。参考になったら幸いです。
