表单提交前的验证形式——form的onsubmit事件

表单提交前的验证方式——form的onsubmit事件
表单提交前的验证方式——form的onsubmit事件
1.1概述
onsubmit事件只在form元素中使用。onsubmit事件会在表单中的提交按钮被点击才会触发，所以常用于在表单提交前进行统一验证。
1.2语法
onsubmit = "return false"，不执行提交。
onsubmit = "return true" 或 onsubmit = "return"，执行提交。
1.3实例
实例——提交验证：

function submitFun(obj){    if(obj.category.value == '' "){        alert("请输入");        return false;    }}

<form onsubmit="submitFun();">    <input type="text" name="category" >    <input type="submit" name="submit" value="提交"></form>

上述实例中，当"提交"按钮被点击时，会触发表单的onsubmit事件，此时函数submitFun()被执行。如果提交为空，则提示输入并返回false，即表单不会被提交。
1.4拓展——onsubmit()与submit()的区别
1、区别
1》onsubmit()是一个js事件，该事件会在表单提交时触发；而submit是一个方法，该方法用于提交form表单。
2》二者操作的前后顺序：onsubmit()在前，submit在后。
2、实例
Js代码：

function fun(){    alert("form submit !");}

<form onsubmit="fun()">    <input type="submit" id="aaa" value="submit">    <input type="button" id="bbb" value="onclick_submit" onclick="document.forms[0].submit();"></form>

注意：点击input[type="button"]按钮，表单会提交，但不会运行函数fun()， 原因是onsubmit事件不能通过此方式触发。点击input[type="submit"]按钮，表单会提交，onsubmit事件也会被触发。
1.5拓展——input[type="submit"]提交与js提交的区别
提交form表单可以使用input[type="submit"]按钮提交，也可以使用javascript来提交表单。
实例：

<form action="" method="post" id="form">    Name: <input type="text" name="username" size="30"><br>    Email: <input type="text" name="useraddr" size="30"><br>    Notice: <textarea name="comments" cols="30" rows="5"></textarea><br>    <input type="button" value="Send Form" onclick=" formSubmit ();">    <--一般情况下，这里是使用submit--></form>

function formSubmit(){    document.getElementById("form").submit();}

上述使用js来提交表单，首先需要获取form表单，然后使用js的submit()方法来提交表单到服务器。而使用input[type="submit"]按钮来提交则不需要获取form表单。