html表单用法

html表单用途

html用于收集用户的输入向服务端提交数据,从而实现用户与web端的交互

html表单的属性

1.action:规定当提交表单时,向何处发送表单数据。
2.method:用于传输表单的方法。常用get/post
method:该属性定义浏览器将表单中的数据提交给服务器处理程序的方式。关于method的取值,最常用的是get和post。第一,使用get方式提交表单数据,Web浏览器会将各表单字段元素及其数据按照URL参数格式附在

标签的action属性所指定的URL地址后面发送给Web服务器;由于URL的长度限制,使用get方式传送的数据量一般限制在1KB以下。第二,使用post方式,浏览器会将表单数据作为HTTP请求体的一部分发送给服务器。一般来说,使用post方式传送的数据量要比get方式传递的数据量大;根据HTML标准,如果处理表单的服务器程序不会改变服务器上存储的数据,则应采用get方式(比如查询),如果表单处理的结果会引起服务器上存储的数据的变化,则应该采用post方式(比如增删改操作)。第三,其它方式(Head、PUT、DELETE、TRACE 或 OPTIONS等)。其实,最初HTTP标准对各种操作都规定了相应的method,但后来很多都没有被遵守,大部分情况只是使用get或post就OK。
3.target:该属性指定在何处打开action指定的url返回的结果
_blank在新窗口重打开
_self 在默认值 在本窗口打开
_parent 在父框架中打开
_top在整个框架中打开
_framename在指定的框架中打开
4.title:设置网站访问者的鼠标放在表单上的任意位置停留时,浏览器用小浮标显示的文本。
5.enctype:规定表单的编码方式

表单元素

1.单行文本框(input 的type 属性的默认值就是"text")


  以下是单行文本框的主要属性:

size:指定文本框的宽度,以字符个数为单位;在大多数浏览器中,文本框的缺省宽度是20个字符。

value:指定文本框的默认值,是在浏览器第一次显示表单或者用户单击按钮之后在文本框中显示的值。

maxlength:指定用户输入的最大字符长度。

readonly:只读属性,当设置readonly属性后,文本框可以获得焦点,但用户不能改变文本框中的value。

disabled:禁用,当文本框被禁用时,不能获得焦点,当然,用户也不能改变文本框的值。并且在提交表单时,浏览器不会将该文本框的值发送给服务器。

2.密码框


  3.单选按钮

使用方式:使用name相同的一组单选按钮,不同radio设定不同的value值,这样通过取指定name的值就可以知道谁被选中了,不用单独的判断。单选按钮的元素值由value属性显式设置,表单提交时,选中项的value和name被打包发送,不显式设置value。

 

4.复选框

使用复选按钮组,即name相同的一组复选按钮,复选按钮表单元素的元素值由value属性显式设置,表达提交时,所有选中项的value和name被打包发送

不显式设置value。复选框的checked属性表示是否被选中,或者(推荐)checked、readonly等这种一个可选值的属性都可以省略属性值。

  
 
 

5.隐藏域

隐藏域通常用于向服务器提交不需要显示给用户的信息。


  6.文件上传

使用file,则form的enctype必须设置为multipart/form-data,method属性为POST。


  7.下拉框标记创建一个列表框,

多行文本,cols=“50”、rows=“15”属性表示行数和列数,不指定则浏览器采取默认显示。
9.标签

前可以写普通的文本来修饰,但是单击修饰文本的时候input并不会得到焦点,而用label则可以,for属性指定要修饰的控件的id
10.

标签

fieldset标签将控件划分一个区域,看起来更规整。
1


2 爱好
3
4
5
6

  11.提交按钮

当用户单击的提交按钮时,表单数据会提交给标签的action属性所指定的服务器处理程序。中文IE下默认按钮文本为“提交查询”,可以设置value属性修改按钮的显示文本。


12.重置按钮

当用户单击按钮时,表单中的值被重置为初始值。在用户提交表单时,重置按钮的name和value不会提交给服务器。


  13.普通按钮
 普通按钮通常用于单击执行一段脚本代码。


14.图像按钮

图像按钮的src属性指定图像源文件,它没有value属性。图像按钮可代替,而现在也可以通过css直接将按钮的外观设置为一幅图片。

你可能感兴趣的:(html表单用法)