具有抖动效果的JavaScript表单验证

时间:2012-03-09 12:55:38

标签: javascript jquery forms validation

在将其发送到我的PHP之前,我正在使用一些JavaScript表单验证。 (我还在学习)。但我今天的问题是如何在不重新加载页面的情况下收到我的错误消息。当我点击提交时,我的下面的JS代码似乎重新加载了页面。默认情况下,错误消息样式设置为disply:none;,仅在需要时显示。

我希望你明白我的目标。哈哈,提前谢谢你。

这是js代码。

function validateLoginForm() {
    var x = document.getElementById('email').value;
    if (x == null || x == "" || x == "Email") {
        document.getElementById('errorWrapper').style.display='block';
        document.getElementById('errorText').innerHTML='Please enter your Email address!';
        shakeIt();
        return false;
    }
}

和jQuery。

$(document).ready(function() {
    function shakeIt(){
        $('#errorWrapper').effect("shake", { times:5, distance:8 }, 50);
    }
});

1 个答案:

答案 0 :(得分:2)

您需要在form.submit即

上执行此操作
$('#loginForm').submit(function(e){
var x= $('#email').val();
      if (x==null || x=="" || x=="Email")
      {
      $('#errorWrapper').show();
      $('#errorText').text('Please enter your Email address!');
      e.preventDefault();
      shakeIt();
      }
      return true;
});

返回false会使页面无法重新加载..