jquery submit()表单到当前页面,带有电子邮件验证器

时间:2013-08-28 15:12:43

标签: javascript jquery forms

我正在使用基本的javascript电子邮件验证功能,并且在条件满足时尝试使用jQuery提交表单。但是,submit()函数似乎没有运行,因为符合电子邮件验证。

HTML

<form id="profile" action="" method="post">
    <input type="text" id="email">\
    <span class="error" id="email_err">Email address not valid.</span>
    //Other Form data
</form>
<div id="form-submit">Submit</div>

jQuery的/使用Javascript

function IsEmail(email) {
    var regex = /^([a-zA-Z0-9_.+-])+\@(([a-zA-Z0-9-])+\.)+([a-zA-Z0-9]{2,4})+$/;
    return regex.test(email);
}

jQuery(document).ready(function($){

    $('#form-submit').click(function(){
        var email = $('#email').val();
        if(!IsEmail(email)){
            $('#email_err').show();
            $('#email').focus();
        }else{
            $('#profile').submit();
        }
    });
}

现在我想要它做的就是抓住电子邮件验证。我想要处理的实际表单提交和数据写入我现在已经设置了用于写入数据的PHP在当前页面上的action="")。最初,它是一个实际的表单提交按钮,但我想尝试验证电子邮件而不刷新页面。

我认为我对submit()函数的理解可能是不合适的,因为我正在阅读的内容似乎只是表单提交的监听器,但实际上并不提交表单本身。这是正确的还是我只是在某个地方出现了什么?

1 个答案:

答案 0 :(得分:1)

由于您只是在验证表单,因此如果表单有效,您只需返回truefalse

以下的一些变体:

$("#profile").submit(function() {
  var email = $('#email').val();
  if (!IsEmail(email)) {
    ...
    return false; // Form will not submit
  }
  ...
  return true; // Form will submit as usual
});

请确保使用<input type="submit" />,因为您直接附加到提交事件。