HTML学习笔记-form表单（五）

<form>表单元素

基本概念
HTML表单是HTML元素中较为复杂的部分，表单往往和脚本、动态页面、数据处理等功能相结合，因此它是制作动态网站很重要的内容。
表单一般用来收集用户的输入信息
表单工作原理
访问者在浏览有表单的网页时，可填写必需的信息，然后按某个按钮提交
这些信息通过Internet传送到服务器上。
服务器上专门的程序对这些数据进行处理，如果有错误会返回错误信息，并要求纠正错误
当数据完整无误后，服务器反馈一个输入完成的信息

<form id="form1" name="form1" method="post" action="">
    账号：<input type="text" name="account" /><br />
    密码：<input type=“password" name="password" /><br />
    <input type="submit" name="submit" value="提交" />
    <input name="reset" type="reset" id="reset" value="重置" />
</form>

<form>标记属性

属性 值 含义
name
name名 表单的识别名称，用于样式设置和脚本访问。此属性为了向下兼容而存在，建议以id属性代替。该属性仅在Transitional 和Frameset DTD中使用

action
URL 指定一个表单处理目标URL，表单数据将被提交到该URL地址的处理程序。如果该属性值为空，则提交到文档自身。该属性值可以为绝对地**址、相对地址、文档片段，甚至是脚本代码

method
get | post 将表单数据提交到http服务器的方法，可能值有两个：get和post。

enctype
MIME类型 指定表单数据的编码类型，此属性只有在method属性设置为post时才有效。默认值为application/x-www-form-urlencoded对所有字符进行编码。如果表单包含用于文件上传的控件（input type=“file”），那么这个属性值必须设为multipart/form-data ，不对字符进行编码。

target
目标框架名 规定在何处打开 action URL。 _blank | _parent _self | _top framename

post与get提交方法

GET提交方法
如果为get，那么所提交的数据集将被作为一个由表单的所有名/值对组成的查询字符串（query string）添加到表单处理器的URL（action属性）的末尾。
index.php?variable1=content1&variable1=content2
这种方法提交的信息在长度上有一定限制，而且不安全，适合简单的数据查询
POST提交方法
如果为post，那么数据集将直接发给表单处理程序，而不是以可见的URL查询字符串的形式。post方法可以提交更长的数据，并且相对安全一些，传送的数据类型更多一些（不限于ASCII字符），因而适用于数据更复杂的表单。浏览器的默认方法为get。

<input>标记属性

属性 值 含义
name
name名 定义input元素的名称

value
任何字符 控件初始显示的文字内容（数据）

size
整数 定义输入字段的宽度

maxlength
整数 规定输入字段中的字符的最大长度

checked
checked 指定控件处于被选取状态，此布尔属性仅适用于type属性设置为radio或checkbox时生成的控件

readonly
readonly 指定控件处于只读状态

disabled
disabled 当 input 元素加载时禁用此元素

src
URL type属性设置为image时，此属性指定图片来源，此图片用于修饰图形化的提交按钮

type
预定义值 规定 input 元素的类型。

<input>标记——type属性

type 属性值 控件名称 代码
text 单行文本输入框

<input type=“text”/>

password 密码输入框

<input type=“password”/>

checkbox 复选框

<input type=“checkbox”/>

radio 单选框

<input type=“readio” checked=“checked” />

submit 提交按钮

<input type=“submit” value=“提交”/>

reset 重置按钮
<input type=“reset” value=“重置”/>
image 图片提交按钮

<input type=“image” src=“URL”/>

button 普通按钮
<input type=“button” value=“普通按钮”/>
hidden 隐藏控件

<input type=“hidden” name=“” value=“”/>

file 文件选择控件
<input type=“file” name=“” />

上传文件域type=file

上传文件域

<input type=“file” name=“upFile” />

该元素包含一个文本输入字段，用来输入文件名，还有一个按钮，用来打开文件选择对话框以便图形化选择文件。
当一个中有“上传文件域”，必须指定MIME类型
<form enctype=“multipart/form-data”>
，否则无法上传文件。
上传文件域，只在method=“post”下才有效。
属性：id、name、 value、disabled、size

隐藏域type=“hidden”

定义隐藏域

<input type=“hidden” name=“nid” value=“234” />

隐藏字段对于用户是不可见的。
隐藏字段通常会存储一个默认值，它们的值也可以由 JavaScript 进行修改。
一般用在，修改某条数据时，用来记录数据的id号。