关于HTMLdeform表单提交onclick和onsubmit

 onsubmit只能表单上使用,提交表单前会触发, onclick是按钮等控件使用, 用来触发点击事件。

在提交表单前，一般都会进行数据验证，可以选择在submit按钮上的onclick中验证,也可以在onsubmit中验证。

但是onclick比onsubmit更早的被触发。

提交过程
用户点击按钮 ---->触发onclick事件  ---->onclick返回true或未处理onclick ----> 触发onsubmit事件  ----> onsubmit未处理或返回true  ------> 提交表单.

onsubmit处理函数返回false，onclick函数返回false，都不会引起表单提交。

onsubmit

<script language="javascript">   function CheckPost ()   {      if (addForm.user.value == "")      {          alert("请填写用户名！");          addForm.username.focus();          return false;      }     if (addForm.title.value.length < 5)     {          alert("标题不能少于5个字符！");          addForm.title.focus();          return false;     }     return true;   }</script><form action="test.php" method="post" name="addForm"  onsubmit="return CheckPost();">     <div>用户:<input type="text" size="10" name="user" maxlength="20"/></div>     <div>标题:<input type="text" name="title" maxlength="50"/></div>     <div>内容:<textarea name="content" rows="8" cols="30"></textarea></div>     <div>           <input type="submit" name="submit" value="发表留言"/>     </div></form>

onclick

 <script language="javascript"> 2     function SendForm ()  3     { 4         if(CheckPost())  5         { 6             document.addForm.submit(); 7         } 8     } 9 10     function CheckPost () 11     {12          if (addForm.user.value == "") 13          {14                alert("请填写用户名！");15                addForm.username.focus();16                return false;17          }18          if (addForm.title.value.length < 5) 19          {20                alert("标题不能少于5个字符！");21                addForm.title.focus();22                return false;23          }24          return true;25     }26 </script>27 28 <form action="test.php" method="post" name="addForm">29      <div>用户:<input type="text" size="10" name="user" maxlength="20"/></div>30      <div>标题:<input type="text" name="title" maxlength="50"/></div>31      <div>内容:<textarea name="content" rows="8" cols="30"></textarea></div>32      <div><input type="button" name="submit" value="发表留言" onclick="SendForm();"/></div>33 </form>