0%

高程笔记6-表单知识

发表于 2018-05-06

高程笔记6

表单的基础知识

在 HTML 中，表单是由

元素来表示的，而在 JavaScript 中，表单对应的则是 HTMLFormElement
类型。HTMLFormElement 继承了 HTMLElement，因而与其他 HTML 元素具有相同的默认属
性。不过，HTMLFormElement 也有它自己下列独有的属性和方法。

 acceptCharset：服务器能够处理的字符集；等价于 HTML 中的 accept-charset 特性。
 action：接受请求的 URL；等价于 HTML 中的 action 特性。
 elements：表单中所有控件的集合（HTMLCollection）。
 enctype：请求的编码类型；等价于 HTML 中的 enctype 特性。
 length：表单中控件的数量。
 method：要发送的 HTTP 请求类型，通常是”get”或”post”；等价于 HTML 的 method 特性。
 name：表单的名称；等价于 HTML 的 name 特性。
 reset()：将所有表单域重置为默认值。
 submit()：提交表单。
 target：用于发送请求和接收响应的窗口名称；等价于 HTML 的 target 特性

提交表单
<!-- 通用提交按钮 -->
<input type="submit" value="Submit Form">
<!-- 自定义提交按钮 -->
<button type="submit">Submit Form</button>
<!-- 图像按钮 -->
<input type="image" src="graphic.gif">


<!-- 通用重置按钮 -->
<input type="reset" value="Reset Form">
<!-- 自定义重置按钮 -->
<button type="reset">Reset Form</button>

表单共有的表单字段属性除了

元素之外，所有表单字段都拥有相同的一组属性。由于类型可以表示多种表单字段，因此有些属性只适用于某些字段，但还有一些属性是所有字段所共有的。表单字段共有的属性如下。

 disabled：布尔值，表示当前字段是否被禁用。
 form：指向当前字段所属表单的指针；只读。
 name：当前字段的名称。
 readOnly：布尔值，表示当前字段是否只读。
 tabIndex：表示当前字段的切换（tab）序号。
 type：当前字段的类型，如”checkbox”、”radio”，等等。
 value：当前字段将被提交给服务器的值。对文件字段来说，这个属性是只读的，包含着文件
在计算机中的路径。

//避免多次提交表单
EventUtil.addHandler(form, "submit", function(event){
 event = EventUtil.getEvent(event);
 var target = EventUtil.getTarget(event);
 //取得提交按钮
 var btn = target.elements["submit-btn"];
 //禁用它
 btn.disabled = true;
});

除了
之外，所有表单字段都有 type 属性。对于元素，这个值等于 HTML 特
性 type 的值。对于其他元素，这个 type 属性的值如下表所列.此外，和