html 原有的表单即表单控件
1.1 form元素:
form 元素用于生成表单,该元素不会生成可视化部分。
form元素可以指定 id、style、class等核心属性,还可以指定onclick等事件属性。除此以外还可以指定如下几个属性。1.action:指定当点击表单的“确定”按钮时,该表单被提交到那个地址。该地址可以指定一个绝对地址也可以指定一个相对地址。该属性必填。
2.method:指定提交表单时发出何种类型的请求。该属性必填
3.enctype:指定对表单内容进行编码所使用的字符集。
4.name:指定表单的唯一名称,建议该属性与id值保持一致。
5.target:指定使用那种方式打开目标url. GET方式的请求:该方式的请求会将请求参数的名称和值转换称字符串,并附加在url之后,因此可以在所在地址栏中看到请求参数名和值。且get请求传送的数值量较小,一般不能超过2KB。原因是受第三方限制。
POST方式请求:这种方式通常使用提交表单的方式来发送,POST方式传输的数据量较大,通常认为POST请求参数的大小不会受限制,但往往取决于服务器的限制,POST请求传输的数据量总比GET传输的数据量大。而且POST方式发送的请求参数以及对应的值在HTML HEADER中传输,用户不能在地址栏里看到请求参数值,安全性较高。
当在form元素里定义一个或多个表单控件时,一旦提交该表单,该表单里的表单控件将会转换为请求参数,关于该表单转换为请求参数的规则如下: 每个由name属性的表单控件对应一个请求参数,没有name的表单控件不会生成请求参数。
如果多个表单控件由相同的name属性,则多个表单控件只生成一个请求参数,只是该参数有多个值。
表单控件的name属性指定请求参数名,value属性指定请求参数值。
如果某个表单设置了disabled或disabled="disable"属性,则该表单不再生成请求参数。
1.2 input元素:
input元素是表单控件元素中功能最丰富的,如下几种输入元素都是通过input元素生成的。 单行文本框:指定input元素的type属性为text即可。
密码输入框:指定input元素的type属性为password即可。
隐藏域:指定input元素的type属性为hidden即可。
单选框:指定input元素的type属性为radio即可。
复选框:指定input元素的type属性为checkbox即可。
图像域:指定input元素的type属性为image即可。当type=“image”时,可以为input元素指定width和height两个属性。
文本上传域:指定input元素的type属性为file即可。
提交、重设、无动作按钮:分别指定input元素的type属性为submit、reset或button即可。
在上面的这些表单控件中,单行文本框、密码输入框都用于接收用户输入,而隐藏域不能接收用户输入,也不能生成可视化部分,它用于提交额外的参数请求,该请求参数的值就是隐藏域的value属性值。
单选框、复选框不能接收用户输入,因此定义他们时同时也会指定value属性值,用于设定他们所对应的请求参数的值。对于单选框、复选框而言,当他们勾选后,他们才会生成请求参数。
文本上传域会生成一个单行文本框,和一个“浏览”按钮,该文件上传域允许用户浏览本地磁盘文件,并将该文件上传到服务器。
input元素可以指定id、style、class等核心属性,也可以指定onclick等核心属性,还可以指定onfocus、onblur等焦点事件属性:。除此之外,还可以指定如下属性。 checked:设置单选框、复选框初始状态是否处于选中状态。该属性支持boolean值的属性,表示初始即被选中。只有当type属性为checkbox或video时才能指定该属性。
disabled:设置首次加载时禁用此元素。该属性支持boolean值的属性,表示该元素被禁用,该元素无法获取焦点、无法选中、无法在其中输入文本,无法相应鼠标点击、双击事件。当type=“hidden”时不能指定该元素。
浏览器并不是把from元素里所有的单选框都当成一组,而是把具有相同name属性的单选框当成一组,因此多个具有相同name的单选框只能选择其中一个;不同name的单选框之间互不干扰。
1.3使用label定义标签。
label元素用于在表单元素中定义标签,这些标签可以对其他可生成请求参数的表单控制元素(单行文本框、密码框等)进行说明。label元素不需要生成请求参数,因此不要为label元素指定value值。
label元素可以指定id、style、class、等属性,也可以指定onclick等事件属性。除此之外,还可以指定一个for属性,该属性指定该标签与那个表单控件关联。
让标签和表单控件关联有两种方式 隐式使用for属性:指定label元素的for属性值为所关联表单控件的id属性值。
显示关联:将普通文本、表单控件一起放在label元素内部即可。
尽量少使用显示关联的方式,这种方式在早期的Internet Explorer浏览器中没有很好的支持,当用户点击label元素对应的标签时,所关联的表单空间并不会获得输入焦点。
1.4 select和option元素
select元素用于创建列表框或下拉菜单,该元素必须和option元素结合使用,每个option元素代表一个列项或菜单项。
于其他表单控件不同的是,select属性本身并不指定value属性,列表框或下拉菜单控件对应的参数值由option元素来生成,当用户选中了很多列表项或菜单项后,这些列表项或菜单项的value值作为该select元素多对应的请求参数。
select元素指定id、style、class等核心属性,该元素仅可指定onchange事件属性------当该列表框或下拉列表项内的选中选项发生改变时,触发onchange事件。除此以外,select元素还可以指定如下几个属性。 disabled:设置禁用列表框或下拉菜单。该属性的值只能是disabled或省略属性值。
multiple:设置该列表框和下拉菜单是否允许多选。概述性支持boolean值的属性,即允许多选。一旦设置允许多选,select元素就会自动生成列表框。
size:指定该列表框内可同时宣示多个列表项。一旦指定该属性,select元素就会自动生成列表框。 一个select元素到底是生成列表框,还是生成下拉菜单,完全由是否指定了size和multiple属性来决定,只要有select元素指定了这两个属性之一,浏览器就会生成列表框,否在就是下拉菜单。
在select元素中,只包含如下两个子元素。
option:用于定义列表框选项或菜单项。该元素里只能包含文本内容作为选项的文本。
optgrop:用于定义列表项或菜单项组。该元素只能包含option子元素,处于optgroup里的option就属于该组。
option元素可以指定id、style、class等核心属性,还可以指定onclick等事件相应属性。除此之外,还可以指定如下几个属性。 disabled:指定禁用概属性,概述性的值只能是disabled
selected:指定该列表项初始状态是否处于被选中状态,该属性的值只能是selected。
value:指定该选项对应的请求参数。
optgroup:元素可以指定id、style、class等核心属性,可以指定onclick等事件相应属性。除此之外,还可以指定如下两个属性。 label:指定该选项组的标签,这个属性必填。
disabled:设置禁用该选项组里的所有选项。该属性值只能是disabled或者省略概述性。