Question

我有一个输入框，用于测试包装盒中的电子邮件是否有效。这是脚本：

$("#myform").validate({
  rules: {
    field: {
      required: true,
      email: true
    }
  }
});

这是对电子邮件的测试。我也有这个脚本，它会通过在表单中添加另一个类来改变颜色。

$("#myform").toggleClass("othercolor");

我只是不确定将此代码放在何处。对不起刚刚jQuery的新问题。谢谢= D

Answer 1

Here's a demo... (UPDATED)

看起来您可能正在使用jQuery validation plugin。假设您是，您只需要在页面加载时执行$("#myform").validate()来初始化表单验证（例如，通过将其从$(document).ready()调用它）。

$(document).ready(function(){
  $("#myform").validate();
});

如果要在焦点离开电子邮件字段时应用CSS类，可以执行以下操作：

var validator = null;
$(document).ready(function(){
    validator = $("#myform").validate({
      rules: {
        cemail: {
          required: true,
          email: true
        }
      }
    });


    $("#cemail").blur(function() {
        if (validator.form()) {
            $("#myform").addClass("othercolor");
        }
        else {
            $("#myform").removeClass("othercolor");
        }
     });
});

如果表单有效，则validator.form()返回true，否则返回false。请注意.toggleclass（）不会在这里做你想做的事情;您需要根据validator.form()的返回值添加或删除该类。

Answer 2

为什么不把它添加到jQuery的成功回调中：

$("#myform").validate({
rules: {
field: {
  required: true,
  email: true
}
},

success: function(){
$(this).toggleClass('red');    
}

});

在电子邮件验证中使用jQuery更改框颜色？

2 个答案: