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; } }
以上!
フォームでメールアドレス一致のチェックを簡易に行う際は、使用してみてね!
ABOUT ME