Javascript 如果另一个函数为真，则使用该函数

我正在尝试进行表单验证。我成功地创建了验证函数，并将其存储在一个变量下，以便于将来编写

var a = $('#email').keyup(function(){
      var emailRegexp = /^([a-z\d\.-]+)@([a-z\d-]+)\.([a-z]{2,8})(\.[a-z]{2,8})?$/;
      if (emailRegexp.test($('#email').val())) {
        $('#email').addClass('correct');
        $('#email').removeClass('error');
        $('.email-error').html("");
        return true;
      } else {
        $('#email').addClass('error');
        $('.email-error').html("Invalid e-mail");
        return false;
      }
    });

我还有第二个函数，如果

a===true

或

a===false

，则应该有两种情况：

  $(document).ready(function(){
        $('#next1').click(function(){
          if (a === true) {
            $('.first-nav').css({
              "color":"white",
              "background-color":"rgba(133,179,181,1)"});
          } else if(a === false) {
            $('.first-nav').css({
              "color":"white",
            "background-color":"red"});
          }
        });
      });

但是，在第一个函数中，即使条件满足，也不会返回任何内容，因此第二个函数不起作用。

---

我在想，对于第二个函数，如果要更改并不是获取真/假值，而是尝试获取

id=email

的属性

class

，那么变量

a

引用的是jQuery对象，而不是布尔值，因此它将无法通过

a==true

和

a==false

检查。您需要更新keyup事件处理程序中的变量：

// Assume invalid by default
var a = false;

// Update variable when email is filled out
$('#email').keyup(function(){
  var emailRegexp = /^([a-z\d\.-]+)@([a-z\d-]+)\.([a-z]{2,8})(\.[a-z]{2,8})?$/;
  if (emailRegexp.test($('#email').val())) {
    $('#email').addClass('correct');
    $('#email').removeClass('error');
    $('.email-error').html("");
    a = true;
  } else {
    $('#email').addClass('error');
    $('.email-error').html("Invalid e-mail");
    a = false;
  }
});

然后，您可以像现在这样计算

a

。由于它始终是布尔值，因此不必使用比较：

$('#next1').click(function(){
  if (a) {
    // If email is valid
  } else {
    // If email is invalid
  }
});

专业提示：不必听

keyup

事件，只需绑定到

输入

事件即可。这是因为

#email

的值可能会在没有键盘事件的情况下发生变化，例如，当用户使用右键单击+上下文菜单粘贴电子邮件时

$('#email').on('input', function() {
  // Email validation logic here
});

---

它并没有完全回答您的问题，但我想提到的是，您也可以使用html5模式属性而不是javascript。因此，您有一个纯html5/css表单验证的可能性

---

如果表单在此处有效/无效，您可以查看解释和示例，其中包括用于设计字段的css：

我认为jquery对象的计算结果不会为true。这可能是真的，但这不是

a===true

测试的内容。@Terry CollinD是对的吗？如果

a

是任意jquery对象，为什么

a===true

？对不起。我的意思是，没有一个条件会被满足，所以没有一个逻辑会被执行。非常感谢！非常感谢！