Javascript 表单验证为所有字段显示相同的错误消息

下面是一个简单的表单，有两个字段firstname和lastname

表单验证 Jquery：

(function(){
            $('.submit_form').click(function() {                
                    var fail = validate_firstname()
                        fail += validate_lastname();

                    if(fail == "") {
                        return true;
                    } else {                        
                        return false;
                    }               
            });

            function validate_firstname(){
                var fname = $('.fname').val();
                if(fname.length == 0) {
                    $('.err1').text("required");
                } else if(fname.length < 5) {
                    $('.err1').text("Minimum 5 letter");
                }
            }

            function validate_lastname(){
                var lname = $('.fname').val();
                if(lname.length == 0) {
                    $('.err2').text("required");
                } else if(lname.length < 5) {
                    $('.err2').text("Minimum 5 letter");
                }
            }
        })(jQuery);

现在，当我提交表单时，输入字段中没有任何内容。它显示两个字段的必填项。但如果我把名字留空，在姓氏中输入一些文字，说“aaa”，然后提交。它再次给出两个字段所需的相同错误。

---

但它应该显示要求的名字和至少5个字母的姓氏。如何显示每个字段的正确错误。请提供帮助。

姓氏验证替换下一行写入错误的类名

var lname = $('.lname').val();

var lname = $('.lname').val();

---

键入错误-您在这两种情况下都使用了$'.fname'.val

作用{ $。提交表格。单击函数{ var fail=validate\u firstname 失败+=验证\u lastname； 如果失败=={ 返回true； }否则{ 返回false； } }; 函数名{ var fname=$'.fname'.val； 如果fname.length==0{ $'.err1'.textrequired； }否则，如果fname.length<5{ $'.err1'.text至少5个字母； } } 函数验证\u lastname{ var lname=$'.lname'.val； 如果lname.length==0{ $'.err2'.textrequired； }否则，如果lname.length<5{ $'.err2'.text至少5个字母； } } }jQuery； 名字： 姓氏： 你打字有错误 请检查这一行，然后再换一次

var lname = $('.lname').val();