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

jquery submit() form to current page with email validator

本文关键字:电子邮件 验证 submit 表单 当前页 jquery      更新时间:2023-09-26

我使用的是一个基本的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()函数的理解可能有点离谱,因为我读到的似乎只是表单提交的监听器,但实际上并没有提交表单本身。这是正确的吗?还是我只是在某个地方搞砸了?

由于您只是在验证表单,因此如果表单有效与否,您可以简单地返回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" />,因为您直接附加到提交事件。