jQueryでフォームのメールアドレスが一致しているか確認する方法

この記事は約2分で読めます。

jQueryを使用して、お問い合わせフォームによくある「メールアドレス」、「メールアドレス確認」が一致しているいるか確認する方法を紹介します。
では早速書いていこう!

jQueryでフォームのメールアドレスが一致しているか確認する方法

今回は、jQueryでinputに入力された「value属性」を取得して一致するかどう確認します。
こんな感じ。

メールアドレス一致【HTML】

メールアドレスを入力するinputにIDを降っておきます。
onClickで実行します。

<form>
<input class="color-gray" id="mail01" type="email" name="email1" required>
<input class="color-gray" id="mail02" type="email" name="email2" required>

<input type="submit" value="内容を確認する" onClick="return CheckMail()">
</form>

メールアドレス一致【jQuery】

HTMLで指定したIDをのvalue属性を取得する。

function CheckMail() {
	// 入力値取得
	var input1 = $("#mail01").val();
	var input2 = $("#mail02").val();
	// メール比較
	if (input1 !== input2) {
		window.alert("メールアドレスが一致しません。");
		return false;
	} else {
		return true;
	}
}

以上!
フォームでメールアドレス一致のチェックを簡易に行う際は、使用してみてね!

コメント

タイトルとURLをコピーしました