javascript - 在运行剩余的 javascript 之前检查有效的电子邮件

Question

我有一个文本框，要求用户在其中插入有效的电子邮件地址。

当用户提交有效的电子邮件地址时，会在回发数据时显示加载图形。

下面的代码可以很好地显示加载图形，但它不会首先检查电子邮件地址是否有效。有人可以帮忙吗？

$('#btnEmail1Submit').live ("click", function() {
   $('<div class="submitBg"></div>').appendTo(".emailEditContainer");
   $('<div class="submitLoadingCont"><img class="submitLoading" src="images/mypreferences/loading.gif" width="50" height="50" /></div>').appendTo(".emailEditContainer");
});

我在想我需要在点击时运行的函数周围放置一个 if 语句 - 比如:

$('#btnEmail1Submit').live ("click", function() {
  if(emailvalid == true) {   
    $('<div class="submitBg"></div>').appendTo(".emailEditContainer");
    $('<div class="submitLoadingCont"><img class="submitLoading" src="images/mypreferences/loading.gif" width="50" height="50" /></div>').appendTo(".emailEditContainer");
  }
});

我正在使用 asp.net 电子邮件验证 - 它看起来像这样:

<asp:RegularExpressionValidator Display="Dynamic" ValidationGroup="PrimarySubmit" ID="RegularExpressionValidator1" runat="server" ValidationExpression="\w+([-+.']\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*" ControlToValidate="tbEmail1" ErrorMessage="Invalid email address - " />

Answer 1

您需要使用正则表达式来测试电子邮件地址的有效性:

function isValidEmailAddress(emailAddress) {
    var pattern = new RegExp(/^(("[\w-\s]+")|([\w-]+(?:\.[\w-]+)*)|("[\w-\s]+")([\w-]+(?:\.[\w-]+)*))(@((?:[\w-]+\.)*\w[\w-]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$)|(@\[?((25[0-5]\.|2[0-4][0-9]\.|1[0-9]{2}\.|[0-9]{1,2}\.))((25[0-5]|2[0-4][0-9]|1[0-9]{2}|[0-9]{1,2})\.){2}(25[0-5]|2[0-4][0-9]|1[0-9]{2}|[0-9]{1,2})\]?$)/i);
    return pattern.test(emailAddress);
};

来自 this question ，因此请参阅该主题以获取更多信息。

您需要使用用户提供的电子邮件地址调用该函数，因此我假设如下:

var email = $("#emailInput").val();
if(isValidEmailAddress(email)) {
    //Do stuff
}