Form表單提交前js驗證
1. Onclick()
2. Onsubmit()
Button標簽 input (屬性 submit button )標簽
Input type=button 定義按鈕,沒有任何行為。多數情況下,用於通過javascript啟動腳本
Input type=submit 定義提交按鈕,提交按鈕會把表單數據發送到服務器
1. onclick 與 Input type=submit 搭配
<form action=”XXXX” method=”post” >
<input type=”text” name=”nihao” >
<input type=”submit” value=”提交” onclick=”return check(this.from) ” >
</form>
Function check(form){
//這個form參數代表html中的表單元素集合
Form.nihao代表是 <input type=”text” name=”nihao” >真個標簽
Var info =form.nihao.value;
}
在javascript中,事件調用函數時,用return返回值實際上是對window.event.returnValue進行設置
而該值決定當前操作是否繼續,true是繼續 false中斷
2.onsubmit 與 Input type=submit 搭配

上述兩種方法的 Input type=submit 等同於 button標簽
3.onclick 與 Input type=button 搭配

注意:Input type=button 提交不會觸發form的 onsubmit事件
4.html form表單提交前驗證
可以使用form表單的onsubmit方法,在提交表單之前,對表單或者網頁中的數據進行檢驗。
onsubmit指定的方法返回true,則提交數據;返回false不提交數據。
直接看下面的代碼:
1 <HTML>
2 <head>
3 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
4 </head>
5 <BODY>
6 <form action="http://www.baidu.com" onsubmit="return toVaild()">
7 <input type="text" id="ff">
8 <input type="submit" id="submit" value ="提交"/>
9 </form>
10 </BODY>
11 <script language="javascript">
12 function toVaild(){
13 var val = document.getElementById("ff").value;
14 alert(val);
15 if(val == "可以提交"){
16 alert("校驗成功,之后進行提交");
17 return true;
18 }
19 else{
20 alert("校驗失敗,不進行提交");
21 return false;
22 }
23 }
24 </script>
25 </HTML>
上面的網頁中,只有在id="ff"的輸入框中輸入“可以提交”,才進行表單提交;否則不提交。

