Javascript 表单验证不起作用

我正在尝试进行一个简单的表单验证，以便表单显示错误

这是我的代码：

function postregform(frm) {

 var emailPattern = /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+.[a-zA-Z]{2,4}$/;   

  if (frm.name.value='') { 
     $('#error-container2').animate({'top' : '-70px'}, 100);   
       $('#error-container3').animate({'top' : '-70px'}, 100);
        $('#error-container4').animate({'top' : '-70px'}, 100);
        $('#error-container5').animate({'top' : '-70px'}, 100);
        $('#error-container6').animate({'top' : '-70px'}, 100);
    $('#error-container7').animate({'top' : '-70px'}, 100);
   $('#error-container').delay.(200).animate({'top' : '4px'}, 400);
      $('#error-container').delay(3700).animate({'top' : '-70px'}, 400);
   return false; 
  }
  if (frm.email.value=='') { 
    $('#error-container').animate({'top' : '-70px'}, 100);   
       $('#error-container3').animate({'top' : '-70px'}, 100);
        $('#error-container4').animate({'top' : '-70px'}, 100);
        $('#error-container5').animate({'top' : '-70px'}, 100);
        $('#error-container6').animate({'top' : '-70px'}, 100);
    $('#error-container7').animate({'top' : '-70px'}, 100);
    $('#error-container2').delay(200).animate({'top' : '4px'}, 400);
      $('#error-container2').delay(3700).animate({'top' : '-70px'}, 400);           
    return false;

                            }
   if (! emailPattern.test(frm.email.value)) { 
    $('#error-container').animate({'top' : '-70px'}, 100);   
       $('#error-container2').animate({'top' : '-70px'}, 100);
        $('#error-container4').animate({'top' : '-70px'}, 100);
        $('#error-container5').animate({'top' : '-70px'}, 100);
        $('#error-container6').animate({'top' : '-70px'}, 100);
    $('#error-container7').animate({'top' : '-70px'}, 100); 
     $('#error-container3').delay(200).animate({'top' : '4px'}, 400);
      $('#error-container3').delay(3700).animate({'top' : '-70px'}, 400);                    
     return false;
                                               }
       if (frm.textarea.value=='') { 
         $('#error-container').animate({'top' : '-70px'}, 100);   
       $('#error-container3').animate({'top' : '-70px'}, 100);
        $('#error-container2').animate({'top' : '-70px'}, 100);
        $('#error-container5').animate({'top' : '-70px'}, 100);
        $('#error-container6').animate({'top' : '-70px'}, 100);
    $('#error-container7').animate({'top' : '-70px'}, 100);
         $('#error-container4')delay(200).animate({'top' : '4px'}, 400);
      $('#error-container4').delay(3700).animate({'top' : '-70px'}, 400);           
    return false;
                           }
        if (frm.textarea.value.length < 10) { 
          $('#error-container').animate({'top' : '-70px'}, 100);   
       $('#error-container3').animate({'top' : '-70px'}, 100);
        $('#error-container4').animate({'top' : '-70px'}, 100);
        $('#error-container2').animate({'top' : '-70px'}, 100);
        $('#error-container6').animate({'top' : '-70px'}, 100);
    $('#error-container7').animate({'top' : '-70px'}, 100);
         $('#error-container5').animate({'top' : '4px'}, 400);
      $('#error-container5').delay(3700).animate({'top' : '-70px'}, 400);           
    return false;
                          }
       if (frm.textarea1.value.length < 10) { 
         $('#error-container').animate({'top' : '-70px'}, 100);   
       $('#error-container3').animate({'top' : '-70px'}, 100);
        $('#error-container4').animate({'top' : '-70px'}, 100);
        $('#error-container5').animate({'top' : '-70px'}, 100);
        $('#error-container2').animate({'top' : '-70px'}, 100);
    $('#error-container7').animate({'top' : '-70px'}, 100);
         $('#error-container6').delay(200).animate({'top' : '4px'}, 400);
      $('#error-container6').delay(3700).animate({'top' : '-70px'}, 400);           
    return false;
                           }
       if (frm.tooln.value.length < 10) { 
        $('#error-container').animate({'top' : '-70px'}, 100);   
       $('#error-container3').animate({'top' : '-70px'}, 100);
        $('#error-container4').animate({'top' : '-70px'}, 100);
        $('#error-container5').animate({'top' : '-70px'}, 100);
        $('#error-container6').animate({'top' : '-70px'}, 100);
    $('#error-container2').animate({'top' : '-70px'}, 100);
         $('#error-container7').delay(200).animate({'top' : '4px'}, 400);
      $('#error-container7').delay(3700).animate({'top' : '-70px'}, 400);           
    return false;
                           }
    }

函数postregform（frm）{
var emailPattern=/^[a-zA-Z0-9.-]+@[a-zA-Z0-9.-]+[a-zA-Z]{2,4}$/；
如果（frm.name.value=''）{
$（'error-container2'）。动画（{'top'：'-70px'}，100）；
$（'error-container3'）。动画（{'top'：'-70px'}，100）；
$（'error-container4'）。动画（{'top'：'-70px'}，100）；
$（'error-container5'）。动画（{'top'：'-70px'}，100）；
$（'error-container6'）。动画（{'top'：'-70px'}，100）；
$（'error-container7'）。动画（{'top'：'-70px'}，100）；
$（“#错误容器”）.delay.（200）.animate（{'top'：'4px'}，400）；
$（'#error container'）.delay（3700）.animate（{'top'：'-70px'}，400）；
返回false；
}
如果（frm.email.value=''）{
$（“#错误容器”）.animate（{'top'：'-70px'}，100）；
$（'error-container3'）。动画（{'top'：'-70px'}，100）；
$（'error-container4'）。动画（{'top'：'-70px'}，100）；
$（'error-container5'）。动画（{'top'：'-70px'}，100）；
$（'error-container6'）。动画（{'top'：'-70px'}，100）；
$（'error-container7'）。动画（{'top'：'-70px'}，100）；
$（'error-container2'）。延迟（200）。动画（{'top'：'4px'}，400）；
$（'error-container2'）.delay（3700）.animate（{'top'：'-70px'}，400）；
返回false；
}
如果（！emailPattern.test（frm.email.value））{
$（“#错误容器”）.animate（{'top'：'-70px'}，100）；
$（'error-container2'）。动画（{'top'：'-70px'}，100）；
$（'error-container4'）。动画（{'top'：'-70px'}，100）；
$（'error-container5'）。动画（{'top'：'-70px'}，100）；
$（'error-container6'）。动画（{'top'：'-70px'}，100）；
$（'error-container7'）。动画（{'top'：'-70px'}，100）；
$（'error-container3'）。延迟（200）。动画（{'top'：'4px'}，400）；
$（'error-container3'）.delay（3700）.animate（{'top'：'-70px'}，400）；
返回false；
}
如果（frm.textarea.value=''）{
$（“#错误容器”）.animate（{'top'：'-70px'}，100）；
$（'error-container3'）。动画（{'top'：'-70px'}，100）；
$（'error-container2'）。动画（{'top'：'-70px'}，100）；
$（'error-container5'）。动画（{'top'：'-70px'}，100）；
$（'error-container6'）。动画（{'top'：'-70px'}，100）；
$（'error-container7'）。动画（{'top'：'-70px'}，100）；
$（'error-container4'）延迟（200）。动画（{'top'：'4px'}，400）；
$（'error-container4'）。延迟（3700）。动画（{'top'：'-70px'}，400）；
返回false；
}
如果（frm.textarea.value.length<10）{
$（“#错误容器”）.animate（{'top'：'-70px'}，100）；
$（'error-container3'）。动画（{'top'：'-70px'}，100）；
$（'error-container4'）。动画（{'top'：'-70px'}，100）；
$（'error-container2'）。动画（{'top'：'-70px'}，100）；
$（'error-container6'）。动画（{'top'：'-70px'}，100）；
$（'error-container7'）。动画（{'top'：'-70px'}，100）；
$（'error-container5'）。动画（{'top'：'4px'}，400）；
$（'error-container5'）.delay（3700）.animate（{'top'：'-70px'}，400）；
返回false；
}
如果（frm.textarea1.value.length<10）{
$（“#错误容器”）.animate（{'top'：'-70px'}，100）；
$（'error-container3'）。动画（{'top'：'-70px'}，100）；
$（'error-container4'）。动画（{'top'：'-70px'}，100）；
$（'error-container5'）。动画（{'top'：'-70px'}，100）；
$（'error-container2'）。动画（{'top'：'-70px'}，100）；
$（'error-container7'）。动画（{'top'：'-70px'}，100）；
$（'error-container6'）。延迟（200）。动画（{'top'：'4px'}，400）；
$（'error-container6'）.delay（3700）.animate（{'top'：'-70px'}，400）；
返回false；
}
如果（frm.tooln.value.length<10）{
$（“#错误容器”）.animate（{'top'：'-70px'}，100）；
$（'error-container3'）。动画（{'top'：'-70px'}，100）；
$（'error-container4'）。动画（{'top'：'-70px'}，100）；
$（'error-container5'）。动画（{'top'：'-70px'}，100）；
$（'error-container6'）。动画（{'top'：'-70px'}，100）；
$（'error-container2'）。动画（{'top'：'-70px'}，100）；
$（'error-container7'）。延迟（200）。动画（{'top'：'4px'}，400）；
$（'error-container7'）.delay（3700）.animate（{'top'：'-70px'}，400）；
返回false；
}
}

我在表单标签中得到了onSubmit=“return-postregform（this）”设置，它一开始可以工作，但现在不行了。有人能帮我吗

谢谢，

---

Shawn

如果（frm.name.value=''）{（提示只有一个=而不是两个=），这可能至少是一个问题

，但是男孩，当我看你的代码时，我只看到面条：）

必须有一种方法使代码看起来更干净、更可读：）
好吧，我认为这对我来说很容易阅读，但感谢你的建议，但是没有必要这么做。好吧，我现在仍在学习JQuery，这是我想到的唯一方法，但一旦我做到这一点，我就可以使用JQuery.fn.validate创建另一个JQuery fn=//这里的代码我可以简单地执行：$（'#id'）.validate（）“DOWN”？如果您引用的是downvoting，我不会这样做：）有没有任何理由您不使用已经可用于验证的众多库中的一个？在这里尝试重新发明轮子没有任何意义。有这么多JS库已经完成了所有类型的表单验证，它们使用非常简单、性能良好且可扩展。