Question

我对表单没有什么问题，我使用js进行验证。

这是我的表单代码。

<form method="get" onkeydown="checkEnter()" action="emailform.php" id="signupform" name="subscribe">
  <input name="email" id="email" type="text" value="Enter Email for Updates" onfocus="if(this.value=='Enter Email for Updates'){this.value=''};" />
  <input type="hidden" name="submitted" id="submitted" value="true" />
</form>

id signupform我正在使用验证并按下输入按钮提交表单。

但是当放置signupform然后我的验证开始正常工作时有问题，当我输入正确的电子邮件时它会显示错误，当我删除signupform id时，我的表单提交工作正常而没有验证。

这是我的id signupform的JS代码。

function SubscribeForm() {
  $('#signupform').submit(function () {
    $('.email').removeClass('error')
    $('em.error').remove();

    var error = false;
    var emailReg = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/;

    if ($.trim($('.email').val()) == '') {
      $(this).append('<em class="error">Please enter your email address.</em>');
      $(this).addClass('error');
      error = true;
    } else if (!emailReg.test(jQuery.trim($('.email').val()))) {
      $(this).append('<em class="error">Please enter a valid email address</em>');
      $(this).addClass('error');
      error = true;
    }
    if (!error) {
      $("#submit", this).after('<span id="form_loading"></span>');
      var formValues = $(this).serialize();

      $.post($(this).attr('action'), formValues, function (data) {
        $("#signupform").before(data);
      });

      $(':input[type="text"]').attr('value', '');
    }
    return false
  });
}

Answer 1

更改

return false

到

return error;

它引起了问题。

Answer 2

更改

返回false;

到

返回！错误;

此外，将css类“email”添加到输入电子邮件字段，或将jquery更改为选择器代码“.email”更改为“#email”

Answer 3

如果您不需要支持旧版浏览器，也是一种可行的解决方案： placeholder 。

<input placeholder="Enter email" type="text"... />

Answer 4

感谢您的帮助。我只是把这个，现在工作正常。

$('#signupform').submit(function(){
        $('.email').removeClass('error')
        $('em.error').remove();
        var filter = /^([\w-\.]+)@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.)|(([\w-]+\.)+))([a-zA-Z]{2,4}|[0-9]{1,3})(\]?)$/;
        sEmail = document.getElementById('email').value;
        if (filter.test(sEmail)) {

            return true;
        }
        else {
            if(sEmail == '')
            {
                $(this).append('<em class="error">Please enter your email address</em>');
                $(this).addClass('error');
            }
            else
            {
                $(this).append('<em class="error">Please enter a valid email address</em>');
                $(this).addClass('error');
            }
            return false;
        }
    });
});

表单验证错误

4 个答案: