1. 表单基础
在JavaScript中，表单对应的是HTMLFormElement类型，继承自HTMLElement。
表单属性.png
获取form 元素的方法：
var from = document.getElementById("myform");
var form = document.forms[0];//获取页面第一个form元素
var form = document.forms[form]; //页面中名称为form的表单
1.1 提交表单
<input type="submit" value="提交"/>
<button type="submit">提交</button>
<!--图像按钮-->
<input type="image" src="submit.png"/>
form.submit()在调用时，不会触发submit事件，因此在调用之前先验证表单数据。
提交表单是可能出现的最大问题是重复提交表单。
解决方法：在第一次提交表单后就禁用提交按钮。
利用onsubmit事件处理程序取消后续的表单提交操作。
1.2 重置表单
//1.
<input type="reset" value="reset form">
<button type="reset">reset form</button>
//2.
var form= document.forms[0];
form.reset();
//阻止表单重置 EventUtil为工具类
var form= document.forms[0];
EventUtil.addHandler(form, "reset", function(event){
var event = EventUtil.getEvent(event);
EventUtil.preventDefault(event);
});
与submit()方法不同，调用重置方法会像单击重置按钮一样触发reset事件。
1.3表单字段
var first = form.elements[0]; //表单中的第一个字段
form.elements["username"]; //表单中name为username的字段
form.elements.length;//form中字段的长度
当一个form 中多个字段的name相同时，使用elements["color"]，会返回一个NodeList，其中包含三个元素，如果访问elements[0]只会返回第一个元素。
<form action="" method="post" id="myForm">
<ul>
<li><input type="text" name="color" value="green"></li>
<li><input type="text" name="color" value="yellow"></li>
<li><input type="text" name="color" value="red"></li>
</ul>
</form>
GI`72E{_HD[TH2ZNKK{1N]0.png
1.3.1禁用表单事件
EventUtil.addHandler(form, "submit", function(event){
event = EventUtil.getEvent(event);
var target = EventUtil.getTarget(event);
var btn = target.elements["submit-btn"];
btn.disable = true;
});
注意：不能通过onclick事件来实现这个功能。在不同浏览器中onclick和submit的执行顺序不同。
1.3.2共用的表单字段的方法
每个字段都有两个方法：focus()和blur()方法。
HTML5 为表单新增了一个autofocus属性。
<input type="text" autofocus>
1.3.3共用的表单字段的事件
除了支持鼠标、键盘、更改和HTML事件，所有表单字段都支持下列3个事件。
- blur:当前字段失去焦点时触发。
- change:对于<input>和<textarea>元素，在他们失去焦点且value值改变时触发，对于<select>元素，在其选项改变时触发。
- focus:当前字段获得焦点时触发。
2. 文本框脚本
在html中，有两种方式来表现文本框：一种是使用<input>元素的单行文本框，两一种是使用<textarea>的多行文本框。
<input type="text" size="25" maxLength="50" value="intital value">
<textarea rows="25' col="5" ></textarea>
在HTML中不能给<textarea>制定最大的字符数。
