修改验证函数以接受变量答案

【问题标题】：modify validate function to accept variable修改验证函数以接受变量
【发布时间】：2015-10-19 19:17:10
【问题描述】：

我有一个功能（验证），它首先在前端验证电子邮件格式是否正确（以避免大多数垃圾邮件）。目前它验证了一个字段并且工作正常。我尝试修改它以验证任何具有“电子邮件”类的字段，因为同一页面上有多个电子邮件字段。第二个函数 (validateAny) 部分工作，它验证并显示错误消息，但不会像在第一个 (validate) 函数中那样向元素添加/删除错误类。我在这里想念什么？另外，如果该字段为空，我希望它不验证该字段，然后我希望检查位于提交按钮上。检查jsfiddle

function validateEmail(email) { 
    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,}))$/;
    return re.test(email);
}

function validate(){
  //$("#wrong-email-mess-create-process").text("");
  var email = $("#new-usr-name").val();
  if (validateEmail(email)) {
    $("#new-usr-name").removeClass('error');
    $("#new-usr-name").prev().removeClass('error');
    $(".error-mess").fadeOut('fast');
    //$("#wrong-email-mess-create-process").text(email + " is valid :)");
  } else {
    $("#new-usr-name").addClass('error');
    $("#new-usr-name").prev().addClass('error');
    $(".error-mess").fadeIn('fast');
    //$("#wrong-email-mess-create-process").text(email + " is not valid :(");
  }
  return false;
}

$("#new-usr-name").bind("blur", validate);



function validateAny(efield){
  var email = $(efield).val();
  if (validateEmail(email)) {
    $(efield).removeClass('error');
    $(efield).prev().removeClass('error');
    $(".error-mess").fadeOut('fast');
  } else {
    $(efield).addClass('error');
    $(efield).prev().addClass('error');
    $(".error-mess").fadeIn('fast');
  }
  return false;
}

$('.email').blur(function(){
    if( this.value ) {
    validateAny(this.id);
  }
});

【问题讨论】：

标签： jquery forms validation

【解决方案1】：

我相信这是因为您在 blur 事件中传递了 id 而不是字段。

$('.email').blur(function(){
    if( this.value ) {
    validateAny(this);
  }
});

或者在您的 validateAny 中，您需要添加 id 选择器，然后继续使用在函数的其余部分中选择的 jquery 对象：

var $field = $('#' + efield);
var email = $field.val();

更新小提琴：https://jsfiddle.net/d2wd6wh6/2/

【讨论】：

【解决方案2】：

似乎您正在将 id 传递给函数，但 jQuery 需要“#”标识符才能知道您要使用元素的 id。试试这个：

function validateAny(efield){
  efield = '#' + efield;
  var email = $(efield).val();
  if (validateEmail(email)) {
    $(efield).removeClass('error');
    $(efield).prev().removeClass('error');
    $(".error-mess").fadeOut('fast');
  } else {
    $(efield).addClass('error');
    $(efield).prev().addClass('error');
    $(".error-mess").fadeIn('fast');
  }
  return false;
}

【讨论】：