Question

我希望在列出登录页面的错误之前添加自定义消息：

“哎呀，你忘了输入以下内容：”+“用户名”，“密码”（如果两者都没有输入）

或

“哎呀，你忘了输入以下内容：”+“用户名”（如果只输入用户名）

$(document).ready(function(){
$("#loginForm").validate({

    errorLabelContainer: $('#RegisterErrors'),
    messages: {
      username: "Username",
      password: "Password"
              }
     });
      });

在我的HTML

中

<div id="RegisterErrors">

我想我的问题更多是“你如何用逗号分隔错误？”我想将错误保留在一行并用逗号分隔，而不是用子弹列表形式？你能使用包装器属性吗？

HTML上的输出：错误1，错误2（如果两者都丢失）错误1（如果只缺少1）错误2（如果只缺少2个）

Answer 1

你的问题不是很具体，但对于最近的一个项目，我做了类似的事情：

function validate_form(form){
    valid = true;
    error = "";
    with(form){

        error = validateName(first_name);
        if(error!=""){
            $("#fn_error").html(error);
            valid=false;
        }else{
            // clear error
            $("#fn_error").html("");
        }

        error = validateName(last_name);
        if(error!=""){
            //last_name.focus();
            $("#ln_error").html(error);
            valid=false;
        }else{
            // clear error
            $("#ln_error").html("");
        }

        error = validateEmail(email);
        if (error!=""){
            $("#email_error").html(error);
            //email.focus();
            valid=false;
        }else{
            // clear error
            $("#email_error").html("");
        }
    }
    return valid;
}

function trim(s){
  return s.replace(/^\s+|\s+$/, '');
}

function validateEmail(fld){
    var error="";
    var tfld = trim(fld.value);                        // value of field with whitespace trimmed off
    var emailFilter = /^[^@]+@[^@.]+\.[^@]*\w\w$/ ;
    var illegalChars= /[\(\)\<\>\,\;\:\\\"\[\]]/ ;

    if (fld.value == "") {
        fld.style.background = '#FFCCCC';
        //error = "You didn't enter an email address.\n";
        error = "This field is required.";
    } else if (!emailFilter.test(tfld)) {              //test email for illegal characters
        fld.style.background = '#FFCCCC';
        error = "Invalid Email address.";
    } else if (fld.value.match(illegalChars)) {
        fld.style.background = '#FFCCCC';
        error = "Email contains illegal characters.\n";
    } else {
        fld.style.background = 'White';
    }
    return error;
}

// field_name should be "first name" or "last name"
function validateName(fld){
    var error="";
    var tfld = trim(fld.value);                        // value of field with whitespace trimmed off

    if (fld.value == "") {
        fld.style.background = '#FFCCCC';
        error = "This field is required.";
    }else {
        fld.style.background = 'White';
    }
    return error;
}

如果错误存在，您可以构建错误字符串，而不是设置和清除错误。然后根据是否存在错误来设置和清除一个错误。跟我来？

<强>更新要用逗号分隔错误，您将构建错误字符串，如上所述：

error = "oops you forgot to fill in ";
bad_fields = [];
if (form[name] == ""){
  bad_fields.push("name");
}
if (form[email] == ""){
  bad_fields.push("email");
}
error_string = error + bad_fields.join(",");
$("#error_div").html("<span class='error'>"+error_string+"</span>");

这主要是伪代码，但你明白了。

列出错误之前的jQuery验证自定义消息

1 个答案: