資訊專欄INFORMATION COLUMN
摘要：文本框腳本有兩種方式表現(xiàn)文本框的單行文本框和的多行文本框。對(duì)于單行文本框，通過特性可以指定文本框能夠顯示的字符數(shù)，通過特性訪問其內(nèi)容，而則用于指定其可以接受的最大字符數(shù)。
title: 表單腳本
date: 2016-12-19 15:17
tags: JavaScript
在 HTML 中，表單由 元素來表示，但是在 JavaScript 中，表單對(duì)應(yīng)的是 HTMLFormElement 類型，它具有的一些獨(dú)有的屬性和方法。
action: 接收請(qǐng)求的 URL
elements: form 中所有控件的集合
length: form 中控件的數(shù)量
method: 要發(fā)送的 HTTP 請(qǐng)求類型
name: 表單的名稱
reset(): 重置 form 域?yàn)槟J(rèn)值
submit(): 提交 form
target: 用于發(fā)送請(qǐng)求和接收響應(yīng)的窗口的名稱
acceptCharset: 服務(wù)器能夠處理的字符集
enctype: 請(qǐng)求的編碼類型。
查找表單// 通過 ID 查找
var form = document.querySelector("#form1");
// 通過 document.forms 集合查找
var firstForm = document.forms[0] // 索引查找
var myForm = document.forms["form2"] // 取得 name 為 form2 的表單
提交表單
// 通用提交表單 // 自定義提交表單 // 圖像按鈕阻止表單提交的默認(rèn)行為
var form = document.querySelector("#myForm")
EventUtil.addHandler(form, "submit", function(event){
// 取得事件對(duì)象
event = EventUtil.getEvent(event)
var target = EventUntil.getTarget(event)
// 阻止默認(rèn)事件
EventUtil.preventDefault(event);
// 取得提交按鈕
var btn = target.elements["submit-btn"]
// 驗(yàn)證表單
// do something
// 禁用提交按鈕
btn.disabled = true
})
為避免用戶重復(fù)提交，應(yīng)該在第一次提交表單以后就禁用提交按鈕，或者利用 onsubmit 事件處理程序取消后續(xù)的表單提交操作
如上，要在第一次點(diǎn)擊后就禁止提交，只需要監(jiān)聽 submit 事件，并在該事件發(fā)生時(shí)禁用提交表單按鈕即可。
表單字段通過 form 的 elements 屬性可以獲得所有表單字段，然后可以安裝索引或者 name 特性來訪問它們。
如果多個(gè)表單控件都使用一個(gè) name ，那么會(huì)放回一改 name 命名的一個(gè) NodeList 集合
共有的表單字段屬性:
disabled: 布爾值，表示當(dāng)前字段是否被禁用
form: 指向所屬的 form
name: 當(dāng)前字段的名稱
type: 當(dāng)前字段的類型
除了 之外，所有的表單都有 type 屬性，對(duì)于 元素，
該值等于 HTML 的 type 值。
對(duì)于
：type 屬性值 select-one
：type 屬性值 select-multiple
每個(gè)表單字段都有兩個(gè)方法:focus() 和 blur() 方法。
此外，所有表單字段都支持下列 3 個(gè)事件:
blur: 字段失去焦點(diǎn)時(shí) 觸發(fā)
focus: 字段獲得焦點(diǎn)時(shí)觸發(fā)
change: 對(duì)于 和 選擇文本
和