【onsubmit】Form表单onsubmit事件用法详解

表单提交数据时，我们有时会用到onsubmit事件，那么onsubmit事件到底是干什么用的，在什么时候触发onsubmit事件以及如何使用onsubmit。本文章将向大家详细讲解onsubmit事件的工作机制和使用方法。

<script>
function submitFun(){
      alert("111");
}
</script>
<form οnsubmit="submitFun();">
<input type="text" name="category" />
<input type="submit" name="submit" value="提交"/>
</form>

上面实例中，当"提交"按钮被点击时，会触发表单的onsubmit事件，此时函数submitFun()被执行（弹出111）并且表单数据也随之提交到服务器。
 
onsubmit经常用于表单验证。请看下面实例。
<script>
function submitFun(obj){
      if(obj.category.value==''){
          alert("请输入");
          return false;
      }
}
</script>
<form οnsubmit="return submitFun(this);">
<input type="text" name="category" />
<input type="submit" name="submit" value="提交"/>
</form>
当"提交"按钮被点击时，依然会执行submitFun()函数，在submitFun()函数中，我们对表单输入框进行了空验证，如果为空，提示输入并return false,这样表单就不会提交（上面已经说到：当该事件触发的函数中返回false时，表单就不会被提交）。 同时，这里要注意οnsubmit="return submitFun(this);"，不能掉了return，否则表单永远会提交。