DOM(四) 表单(Form)操作

1. 创建表单元素是为了满足用户向服务器发送数据的要求，Web表单使用的Html元素有<form/>,<input/>,<select/>,<textarea/>等

2. <form/>用来向服务器传输数据，它的属性有：

method 表示浏览器发送GET请求或是发送POST请求。

action 表示表单所要提交到的地址URL。

enctype 当向服务器提交数据时，数据应该使用的编码方法，默认是application/x-www-url-encoded,不过，如果要上传文件，可以设置multipart/form-data

accept 当上传文件时候，列出服务器能正确处理的mime类型。

accept-charset 当提交数据时，列出服务器接受的字符编码。

3. <input/>元素是Html的主要输入元素。通过type特性来判断是哪种输入控件：

“text"

"radio"

"checkbox"

"file"

"password"

"button"

"submit"

"reset"

"hidden"

"image"

4. 获取Form使用document.getElementById()或者document.forms["formId"], document.forms[0].

5. 获取Form上的输入字段oForm.elements[0], oForm.elements["textbox1"], oForm.textbox1, oForm["textbox1"]

6. Form 上的方法：form.submit(), form.reset()

7. <input/>有一些属性：

<input type="text" validchars = ”0123456789“/>

<input type="text" invalidchars = ”0123456789“/>

控制input可以输入的字符，除了设置上面的属性，还要考虑用户paste，

在IE里面，可以直接<input text="text" onpaste="return false"/>

对于其它的浏览器，需要组织菜单paste和Ctrl + V来paste

<input type="text" invalidchars="0123456789" onpaste="return false" oncontextmenu="return false"

onkeypress="return blcokchars(this, event, true)/>

function blockChars(oTextbox, oEvent, bBlockPaste)

{

var sInvalidChars = oTextbox.getAttribute("invalidchars");

var sChar = String.fromCharCode(oEvent.charCode);

var bIsValidChar = sInvalidChars.indexOf(sChar) == -1;

if (bBlockPaste)

{

return bIsValidChar && !(oEvent.ctrlKey && sChar == "v");

}

else

{

return bIsValidChar || oEvent.ctrlKey;

}

}

8. 对于<select/>,我们使用oListbox.options[0]来获得选项。