当输入接收焦点时隐藏验证错误

hide validation error when an input receives focus

本文关键字：隐藏 验证 错误 焦点 输入      更新时间：2023-09-26

代码如下:-这里我已经声明了我的变量:

    var first = $('#first');
    var firstError = $('#firsterror'); // the errors are in span tags (if it matters)
    // and so on... 
    first.blur(validateFirst);
    last.blur(validateLast);
    username.blur(validateUsername);
    password.blur(validatePassword);
    confpassword.blur(validateConfpassword);
    month.blur(validateMonth);
    day.blur(validateDay);
    year.blur(validateYear);
    gender.blur(validateGender);
    $('#myForm').submit(function(){
   if( validateFirst() & validateLast() & validateUsername() & validatePassword() &     validateConfpassword() & validateMonth() & validateDay() & validateYear() &   validateGender() ){
        return true;
      }else{
        return false;
      }
    });
    function validateFirst(){
      if(first.val().length < 5){
        first.addClass('error_input');
        firstError.text('You left this empty!');
        firstError.addClass('error');
        return false;
      }else{
        first.removeClass('error_input');
        firstError.text('');
        return true;
      }
    };
      // and so on...  I would like the code to work as so: When an input recives focus the error should hide else the code should run exactly as it is.

谢谢. .

我认为你应该使用jQuery validate lib来验证你的表单这里是jQuery validate的cdn链接..

<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.9/jquery.validate.min.js"></script>

注意，在

行之前必须包含jQuery lib

你所要做的只是写几行代码，如下

$('#form_id').validate({
    rules : {
        'el_name' : 'validation_rule'  // like, required
    },
    messages : {
        'el_name' : 'Your error message'
    }
});

试试这个

$('.error_input').focus(function(){
    $(this).removeClass('.error_input');
});

你已经尝试过这样的东西了吗?

function removeError() {
     $(this).removeClass('error_input');
     $("#error"+$(this).attr("id")).text("").removeClass("error");
}
first.focus(removeError);
last.blur(removeError);
username.blur(removeError);
....
相关文章：