是否可以在没有提交按钮的情况下验证表单？答案

【问题标题】：Is it possible to validate a form without a submit button?是否可以在没有提交按钮的情况下验证表单？
【发布时间】：2016-08-03 11:00:25
【问题描述】：

我有普通的按钮，我使用 jquery 来进行客户端验证。问题是我还想添加服务器端验证，但是当输入类型为提交时，jquery 代码不起作用。当我使用

$('#addperson').submit(function(event){
  event.preventDefault();
  //code for client side  checks
});

客户端代码不起作用。请问有人知道是否有办法让我的按钮同时在客户端和服务器端工作？

【问题讨论】：

那是因为您正在阻止默认行为。如果表单无效，则阻止默认行为。
1 - 点击按钮； 2 - 在客户端验证； 3 - 将 ajax 发送到服务器端或重定向到您在服务器端验证的功能
请问重定向到函数是什么意思？

标签： javascript php jquery forms validation

【解决方案1】：

“提交活动”可能会对您有所帮助

var valid = false;    
$("#valid").on('change', function(){
  valid = this.checked;
})
$('#form').on('submit', function(e){
  console.log(valid);
  if(!valid) {
    e.preventDefault();
    $('#ipt').val('oops, stopped'); 
  } else {
    $('#ipt').val('sending'); 
    //yey
  }
});

工作的jsbin： https://jsbin.com/nowirij/4/edit?html,console,output

【讨论】：

【解决方案2】：

只需先做表单验证客户端，然后再做$('form').submit() 并将所有信息发送到服务器。

$('button').click(function () {
     if (validateMyForm()) {
         $('form').submit();
     }
});

function validateMyForm() {
    // check if valid
    [...]

    return isValid
}

<form>
    <input type="text" name="name"/>
    <button type="button">Submit</button>
</form>

【讨论】：

那么服务器端验证呢？我的意思是我猜 OP 正在使用一些 ajax (async) 来请求服务器并验证数据服务器端 before 是否提交form（比如避免重复的用户电子邮件等...）。您应该使用承诺来处理它。否则，如果不需要等待任何服务器端验证，那么您的代码当然是正确的。编辑：在我重读问题后，我真的不清楚什么是预期的行为，所以也许我完全错了
我想要的是，如果一个字段被留空，例如客户端和服务器端都显示错误消息
@A.Wolff 是的，你是对的，如果使用 Ajax 并等待响应，它比它更复杂，但 OP 没有指定任何细节。所以我假设如果你使用客户端验证，而不是使用 Ajax 调用。