在运行剩余的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);
};

这来自这个问题,所以请查看该主题以获取更多信息.

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

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

Answer 2

您应该使用正则表达式检查电子邮件的有效性

var re = /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/

$('#btnEmail1Submit').live ("click", function() {
   if(!email.match(re)) {
     alert('invalid email');
     return false;
   }
   $('<div class="submitBg"></div>').appendTo(".emailEditContainer");
   $('<div class="submitLoadingCont"><img class="submitLoading" src="images/mypreferences/loading.gif" width="50" height="50" />    </div>').appendTo(".emailEditContainer");
});

正则表达式来自JavaScript中的Validate电子邮件地址？