HTML——表单及表单元素
HTML 表单
表单是一个包含表单元素的区域。
表单元素是允许用户在表单中输入内容,比如:文本域(textarea)、下拉列表(select)、单选框(radio-buttons)、复选框(checkboxes)等等。
表单使用表单标签 <form> 来设置。
- 表单元素
<input> 元素
最重要的表单元素是 <input> 元素。
<input> 元素根据不同的 type 属性,可以变化为多种形态。
<select> 元素(下拉列表)
<select> 元素定义下拉列表:
<select name="cars">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="fiat">Fiat</option>
<option value="audi">Audi</option>
</select>
<option> 元素定义待选择的选项。
列表通常会把首个选项显示为被选选项。
您能够通过添加 selected 属性来定义预定义选项。
<label>元素标签
<label>: 用来管理表单中的文本,可以将文本与控件绑定在一起,从而增加了控件的受力面积。
语法:<label for="控件ID">文本</label>
主要属性:
for:设置该文本所关联的控件ID,关联后点击标签等同于点
击控件
id:元素的唯一标识,相当于元素的身份证号。任何元素都可以有id,程序员有义务保障元素的id不重复。
<p><input type="checkbox" id="c1"><label for="c1">我已阅读并自愿遵守此协议</label>
</p>
<textarea>文本域
相当于多行文本框
语法:
<textarea>文本</textarea>
主要属性:
cols:指定文本区域的列数
rows:指定文本区域的行数
readonly:只读
<p>简介:<textarea rows="10"cols="50">写点什么。。。</textarea>
</p>
- 表单控件——
<input>
元素中的,各个type属性值
1、文本框:<input type="text"/>
2、密码框:<input type="password"/>
主要属性:
(a)value属性:由访问者自由输入的任何文本
(b)maxlength属性:限制输入的字符数
(c)readonly属性:设置文本控件只读
(d)name属性:当提交form时,name作为元素标识被发送到服务器
3、单选框:<input type="radio"/>
4、复选框:<input type="checkbox"/>
主要属性
(a)value:文本,当提交form时,如果选中了此按钮,那么value就被发送到服务器
(b)name:用于实现分组,一组单选框或者复选框的名称必须相同
(c)checked:设置选中
5、隐藏域:<input type="hidden"/>
在表单中包含不希望用户看见的信息
6、文件选择框:<input type="file"/>
选择要上传的文件
如果牵扯到了上传文件,那么我们要在form表单中设置一个属性:
enctype="multipart/form-data"
7、提交按钮:<input type="submit"/>
传送表单数据给服务器端或其它程序处理
8、重置按钮:<input type="reset"/>
清空表单的内容并把所有表单控件设置为最初的默认值
9、普通按钮:<input type="button"/>
用于执行客户端脚本,没有任何功能,需通过js定义功能。
主要属性:
value:按钮的名字
HTML——表单及表单元素相关推荐
- 增加表单的文字段的html的代码是,表单及表单新增元素(示例代码)
要想更好运用表单就要了解表单的的更多元素与属性,首先看看对表单基本了解. 表单的基本了解 元素用于用户输入数据的收集 元素是最重要的表单元素,有许多type其中是用于向表单处理程序提交表单的按钮. 元 ...
- form表单中根据值判断是否disabled_Java 0基础入门 (Html表单、表单元素)
上一篇:Java 0基础入门 (Html标签的使用) 表单在网页中主要负责数据采集功能. 一.表单实际应用场景 百度搜索 5173注册 如上两张图,图中的黑色线条是我画上去的,如果按照黑线,在Excl ...
- 第三章 表单与表单元素
学习目标 理解表单的作用 理解表单与表单元素的关系 掌握表单标签及其属性 掌握各种表单元素标签及其属性 在Web网页中,浏览者经常需要与Web服务器进行数据交互.当浏览者需要填写数据并将这些数据发送到 ...
- 前端:HTML/06/表单,表单元素(单行文本域,单行密码域,单选按钮,复选框,下拉列表,文本区域,上传文件域,各种按钮,隐藏域,lt;caption表格标题)
表单<form>(块元素) 表单的概念:表单主要用来获取用户数据(信息),如:注册表单, 查询表单,登录表单. 表单的工作原理: 浏览有表单的网页,填写一些必要的信息,然后点击某个按钮进行 ...
- JavaScript 表单与表单验证
JavaScript 表单 JavaScript 表单验证 HTML 表单验证可以通过 JavaScript 来完成. 以下实例代码用于判断表单字段(fname)值是否存在,如果存在,则弹出信息,否则 ...
- autojs遍历当前页面所有控件_HTML5表单和表单控件的使用
哈喽大家好,我是作者"未来",本期分享的内容是Web前端系列课程,本系列总共29个阶段,坚持学习3个月蜕变为Web前端高手哦! 志同道合的小伙伴跟我一起学习交流哦! 第一阶段 HT ...
- element 修改表单值后表单验证无效_javascript自学记录:表单脚本1
第14章 表单脚本 14.1 表单的基础知识 获得表单元素: // 取得id为form_1的元素var form = document.getElementById("form_1&quo ...
- access表怎么生成表结构_数据结构——单链表讲解
单链表 单链表的创建分为头插入法和尾插入法两种,两者并无本质上的不同,都是利用指针指向下一个结点元素的方式进行逐个创建,只不过使用头插入法最终得到的结果是逆序的. 1.单链表概念&设计 单链表 ...
- html表单自动提交表单提交表单数据类型,表单
表单在网页中主要负责数据采集功能.一个表单有三个基本组成部分: 表单标签:这里面包含了处理表单数据所用CGI程序的URL以及数据提交到服务器的方法. 表单域:包含了文本框.密码框.隐藏域.多行文本框. ...
最新文章
- 维特森 VTD72K14 多圈空心角度传感器 角位移传感器
- 数据类型 类型检测
- QML 性能优化建议(一)
- python中的异常处理 try..except
- Oracle 欲放手 Java EE,谁能成为继任者?
- 认知计算机语言学,什么是认知语言学
- 会议交流 | DataFunSummit 知识图谱在线峰会——链接知识图谱最前沿技术和最落地产业化应用的桥梁!...
- 微软鲍尔默:IE9浏览器将会在3月发布
- Android 学习资源[转]
- [蓝点zigBee] CC2530 实用教程总览
- [导入]ASP.NET 2.0数据处理之高级分页/排序
- android的wake_lock介绍
- Matlab连接字符串的方法
- POJ3155 Hard Life
- 面试被问到平衡二叉树如何平衡?
- ORA-01830: date format picture ends before converting entire input string
- PPT插入图片为任意形状
- fastposter v2.7.0 发布 电商海报编辑器
- 修改密码PHP博客,phpwind任意修改管理员密码漏洞
- 推荐google浏览器插件(为专注工作使用)
热门文章
- 解决wget下载https时报错
- 从传统采购向SRM数字采购转型,大宗商品企业实现采购成本有效控制
- 日本东映动画遭黑客入侵,《海贼王》等多部作品遭停播
- android 4.1.2版本,android4.1.2版本GPS模块的添加
- IIS 返回405报错解决过程
- 主成分分析在SPSS中的操作应用
- 关于贝叶斯网络算法(Bayesian networks)
- 用java制作一个软件控制小车_Android手机控制智能小车的手机端程序(完整版)...
- 优化函数SGD/AdaGrad/AdaDelta/Adam/Nadam
- 标准化管理-(3)科研项目中的标准化审查