form對象
form物件
一個<form>標記,就是一個<form>物件。
form物件的屬性
name:表單的名稱,主要用來讓JS來控製表單。
action:表單的資料處理程序(PHP檔案)。
method:表單的提交方式,取值:GET、POST
enctype:表單資料的編碼方式。
form物件的方法
submit():提交表單,與<input type = “submit” />功能相同。
reset():重設表單,與重設按鈕功能一樣。
form物件的事件
onsubmit:當點擊提交按鈕時發生,並資料發送到伺服器之前發生。主要用來「在表單提交之前進行表單驗證」。
onreset:當點選重置按鈕時發生。
<!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>php.cn</title> <script type="text/javascript"> window.onload = function(){ //获取form对象 var formObj = document.form1; //增加method属性 formObj.method = "post"; //增加action属性 formObj.action = "login.php"; } </script> </head> <body> <form name="form1"> 用户名:<input type="text" name="username" /> 密码:<input type="password" name="userpwd" /> <input type="submit" value="提交表单" /> </form> </body> </html>
# 取得表單元素
- ##透過網頁元素的id來取得物件。 document.getElementById(id)
- 透過HTML標籤名稱來取得物件。 parentNode.getElementsByTagName(tagName)
- 透過name屬性來取得表單元素物件。表單中所有元素的起點都必須是document物件。
- 語法:document.formObj.elementObj
- 存取方式是三層結構。其中,formObj代表表單對象,elementObj代表表單元素物件。
- 範例:document.form1.username.value.length
##事件傳回值
事件的回傳值,會影響物件的預設動作。如:<a>標記的預設動作是開啟一個網址。
如果事件回傳false,則阻止預設動作的執行;如果事件回傳true或空,則預設動作繼續執行。
<!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>php.cn</title> </head> <body> <a href="http://www.php.cn" onclick="return false">PHP中文网</a> </body> </html>
受傳回值影響的事件有兩個:onclick、onsubmit。