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

java script 归纳总结 黄秉佳
文章标签: onsubmit
1541

表单提交数据时,我们有时会用到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,否则表单永远会提交

还能输出{{restrictNumber}}个字符  
  • {{reply.author}}

    {{CommonUtil.formateDate(reply.ac_CommentDate).shortTime}}
  • 回复了{{Comments.author}} :