使用输入字段的类进行通用表单验证

时间:2017-12-20 09:50:42

标签: javascript jquery regex validation

您好,我想知道您是否可以帮我提供以下主题的一些信息:我想用javascript创建一个通用的表单验证类 并为我的输入字段分配适当的类名以进行验证检查。

我怎样才能做到这一点? 我的意见:

<input type="text" class="alphabeticalValidation" name="Vvehicle"/>

我的验证码:

    function fieldValadation() {
    var errMsg = "";
    var isNumber = $(".numericalValidation");
    var isWord = $(".alphabeticalValidation");
    var regex0 = /^[0-9]+$/;
    var regexA = /^[A-Za-z]+$/;

    // check to see if fields are not empty - if so test the data type
    if (isNumber.length != 0 && isWord.length != 0 ) {


        if (isNumber != regex0) {
            errMsg += "Field can only contain numerical charaters \n"
        }
        if (isWord != regexA) {
            errMsg += "Field can only contain alphabetical characters \n"
        }
    }
    else {
        errMsg += "Fields cannot be empty \n";   
    }
    return errMsg;
}

2 个答案:

答案 0 :(得分:0)

您可以通过使用类进行验证来轻松实现它。您需要做的就是更新您的代码,如下所示 -

$(".numericalValidation").each(function(){
    var isNumber = $(this).val();
    var errMsg = '';
    if (isNumber.length != 0 && isWord.length != 0 ) {
        if (isNumber != regex0) {
            errMsg = "Field can only contain numerical charaters \n"
        }
        if (isWord != regexA) {
            errMsg = "Field can only contain alphabetical characters \n"
        }
    }
    else {
        errMsg = "Fields cannot be empty \n";   
    }
    $(this).parent().find('label').html(errMsg);
 });

答案 1 :(得分:0)

我通过添加.val()找到了我的查询的解决方案;在调用类之后保持通用意味着我可以将类分配给应该验证某个标准的多个输入字段。

我希望这可以帮助将来的某个人。

function fieldValadation() {

    var errmsg = '';    
    var Vehicle = $(".alphabeticalValidation").val();
    var isNumber = $(".numericalValidation").val();

    if (Vehicle != "" && isNumber != "") {
        if (!isNaN(Vehicle)) {
            errmsg += "Field can only contain letters \n";
        }
        if (isNaN(isNumber)) {
            errmsg += "Field can only contain numbers \n";
        }
    }
    else {
        errmsg += "Field cannot be empty \n";
    }

    return errmsg;
}