javascript - jquery を使用した複数のフォームの一般的な電子メール検証

Question

私はフォームを持っています

<form id="Register" method="post" onsubmit="return validateForm()">
     <p><label>Your Email</label><input type="text" name="email"/></p>
     <p style="margin-left:27%;"><input type="submit" name="submit" value="Submit" /></p>
</form>

そして、私はこのフォームのjavascript検証を使用しています

function validateForm() {
var x = document.forms["Register"]["email"].value;
var atpos = x.indexOf("@");
var dotpos = x.lastIndexOf(".");
if (atpos < 1 || dotpos < atpos + 2 || dotpos + 2 >= x.length) {
    alert("Not a valid e-mail address");
    return false;
}
}

フォームが 2 つ以上ある

 <form id="Login" method="post" >
    <p><label>Email</label><input type="text" name="Log_email" /></p>
    <p style="margin-left:27%;"><input type="submit" name="submit" value="Login" /></p>
 </form>

<form id="forgot" method="post">
<p><label>Your Email</label><input type="text" name="email"/></p>
<p style="margin-left:27%;"><input type="submit" name="submit" value="Submit" /></p>
</form>

これらすべてのフォームに共通する JavaScript 検証をどのように書き直すことができますか。

Answer 1

すべてのフォームで同じ電子メール名を使用している場合は、すべてのフォームから「this.id」引数を使用して検証関数を呼び出します

onsubmit="return validateForm(this.id)"

コードを変更します：

function validateForm(id) {
var x = document.forms[id]["email"].value;
var atpos = x.indexOf("@");
var dotpos = x.lastIndexOf(".");
if (atpos < 1 || dotpos < atpos + 2 || dotpos + 2 >= x.length) {
    alert("Not a valid e-mail address");
    return false;
}
}

Answer 2

メール フィールドにクラスを追加して、このアイテムを確認します