html表单元素有哪些

 我来答
依米Ymi
2018-03-30 · TA获得超过1810个赞
知道答主
回答量:9
采纳率:44%
帮助的人:1260
展开全部

HTML中常用的表单元素包括:文本区域(TEXTAREA),列表框(SELECT),文本输入框(INPUT type=text),密码输入框(INPUT type=password),单选输入框(INPUT type=radio),复选输入框(INPUT type=checkbox),重置按钮、提交按钮、隐藏域、等等。

一、文本域<input type="text" name="text" value="" />

二、密码域

密码跟文本框类似,但是在里面输入的内容显示为圆点。
<input type="password" name="text" value="" />

三、单选按钮

男人:<input type="radio" name="sex" value="male" /> Male<br />
女人:<input type="radio" name="sex" value="female" /> Female

四、复选框

<input type="checkbox" name="check1" value="" />

五、按钮

<input type="button" value="确认" />

六、重置按钮

当点击重置按钮时,重置按钮所在的表单将全部清空,而其他表单不受影响。<input type="reset" value="重置" />

七、提交按钮

当点击提交按钮时,浏览器将自动提交表单。<input type="submit" value="提交" />

八、隐藏域

隐藏域在浏览器中并不显示,仅仅为保存一些不太重要的资料而存在。<input type="hidden" value="我是一个隐藏域" />

九、上传域<input type="file" value="" />

十、图片按钮<input type="image" src="123.gif" />

十一、下拉列表<select>
<option value="0">0</option>
<option value="1">1</option>
<option value="2">2</option>
例如:
属性:disabled,可选值:disabled ,说明:规定禁用该下拉列表。  

十二、label

abel 元素不会向用户呈现任何特殊效果。不过,它为鼠标用户改进了可用性。如果您在 label 元素内点击文本,就会触发此控件。就是说,当用户选择该标签时,浏览器就会自动将焦点转到和标签相关的表单控件上。例如,当将单选按钮放在label内。则点击label内的文字也会触发单选按钮,而不必只是点中小圆点。

例如:

<label><input type="radio" name="male" />男人</label></p>
<label><input type="radio" name="male" />女人</label></p>

十三、禁用(disabled)与只读(readonly)

禁用和只读属性。readonly只针对input(text / password)和textarea有效,而disabled对于所有的表单元素都有效,包括select, radio, checkbox, button等。但是表单元素在使用了disabled后,当我们将表单以POST或GET的方式提交的话,这个元素的值不会被传递出去,而readonly会将该值传递出去。

禁用文本框:<input type="text" disabled="disabled" />

只读文本框: <input type="text" readonly="readonly" /></form>

十四、TextArea

十五、fieldset    定义域
fieldset用于给表单元素分组,legend用于设置分组标题。

表单在网页中主要负责数据采集功能。一个表单有三个基本组成部分: 表单标签,这里面包含了处理表单数据所用CGI程序的URL以及数据提交到服务器的方法。表单域,包含了文本框、密码框、隐藏域、多行文本框、复选框、单选框、下拉选择框和文件上传框等。表单按钮,包括提交按钮、复位按钮和一般按钮;用于将数据传送到服务器上的CGI脚本或者取消输入,还可以用表单按钮来控制其他定义了处理脚本的处理工作。

ggxrx
2018-11-09 · 贡献了超过335个回答
知道答主
回答量:335
采纳率:25%
帮助的人:25.1万
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
匿名用户
推荐于2017-11-23
展开全部
一、文本域
<input type="text" name="text" value="" />

二、密码域
  密码跟文本框类似,但是在里面输入的内容显示为圆点。
<input type="password" name="text" value="" />

三、单选按钮
男人:<input type="radio" name="sex" value="male" /> Male
<br />
女人:<input type="radio" name="sex" value="female" /> Female

四、复选框
<input type="checkbox" name="check1" value="" />

五、按钮
<input type="button" value="确认" />

六、重置按钮
  当点击重置按钮时,重置按钮所在的表单将全部清空,而其他表单不受影响。
<input type="reset" value="重置" />

七、提交按钮
  当点击提交按钮时,浏览器将自动提交表单。
<input type="submit" value="提交" />

八、隐藏域
  隐藏域在浏览器中并不显示,仅仅为保存一些不太重要的资料而存在。
<input type="hidden" value="我是一个隐藏域" />

九、上传域
<input type="file" value="" />

十、图片按钮
<input type="image" src="123.gif" />

十一、下拉列表
<select>
<option value="0">0</option>
<option value="1">1</option>
<option value="2">2</option>
</select>

  
属性 可选值 说明

disabled
disabled 规定禁用该下拉列表。

multiple multiple 规定可选择多个选项。
name name 规定下拉列表的名称。
size number 规定下拉列表中可见选项的数目。
十二、label
  label 元素不会向用户呈现任何特殊效果。不过,它为鼠标用户改进了可用性。如果您在 label 元素内点击文本,就会触发此控件。就是说,当用户选择该标签时,浏览器就会自动将焦点转到和标签相关的表单控件上。例如,当将单选按钮放在label内。则点击label内的文字也会触发单选按钮,而不必只是点中小圆点。
<p><label><input type="radio" name="male" />男人</label></p>
<p><label><input type="radio" name="male" />女人</label></p>

  男人 女人
也可以写成这样

<form>
<label for="male">Male</label>
<input type="radio" name="sex" id="male" />
<br />
<label for="female">Female</label>
<input type="radio" name="sex" id="female" />
</form>

十三、disabled与readonly
   禁用和只读属性。readonly只针对input(text / password)和textarea有效,而disabled对于所有的表单元素都有效,包括select, radio, checkbox, button等。但是表单元素在使用了disabled后,当我们将表单以POST或GET的方式提交的话,这个元素的值不会被传递出去,而readonly会将该值传递出去。
  可以在用户按了提交按钮后,利用javascript将提交按钮disabled掉,这样可以防止网络条件比较差的环境下,用户反复点提交按钮导致数据冗余地存入数据库。
<form id="form1" action="/home/index" method="post">
禁用文本框:<input type="text" disabled="disabled" />
只读文本框: <input type="text" readonly="readonly" />
</form>

十四、TextArea

属性

描述
DTD

cols number 规定文本区内的可见宽度。 STF
rows number 规定文本区内的可见行数。 STF
<form id="form1" action="/home/index" method="post">
<textarea cols="10" rows="10">我是一个兵,来自老百姓。</textarea>
</form>

十五、fieldset  定义域
    fieldset用于给表单元素分组,legend用于设置分组标题
本回答被网友采纳
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
收起 1条折叠回答
推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式