表单
4.1 表单
什么是表单？收集用户填写的信息并将其提交到后台服务器。
<form>
action属性：指定提交的地址；
method属性：指定提交的方式，get/post。
get和post方式的区别：
（1）长度的限制，get方式限制为2k以内；
（2）安全性，get方式提交的数据会直接呈现在地址栏，敏感数据容易被截获。
4.2 文本框
<input id="userId" type="text" maxlength="10" size="20" value="abc">
maxLength:指定文本框能接收的最大字符个数；
size：指定文本框的大小（宽度）
value:指定初始值
4.3 密码框
<input type="password">
密码框和文本框是一样的，文本框的属性同样适用于密码框，唯一不同的是密码框是以掩码的形式显示内容，保证安全性。
4.4 label
<label>的作用
（1）可以单独对其应用相应的样式
（2）for属性可以使之和某个<input>关联，即当单击文本会激活对应的<input>。
<label for="userId">账号：</label>
<input id="userId" type="text" maxlength="10" size="20" value="abc">
<br>
<label for="password">密码：</label>
<input id="password" type="password" maxlength="6">
4.5 提交按钮
<input type="submit" value="提交">
(1)点击按钮之后跳转到form表单指定的Action。
(2)value属性：value对应的值就是按键上显示的文字。
(3)点击按钮：将form表单中的input 中name属性值（键）和用户输入的值组成键值对（或input标签value属性对应的值）。 并拼接到form表单Action属性值的后面。
4.6重置按钮
<input type="reset" value="重置">
(1)点击按钮，重置表单内部的输入框（单选按钮）
(2)value属性：value对应的值就是按键上显示的文字。
案例：登录表单
<form action="http://www.baidu.com" method="get">
<label>账号：</label>
<input type="text" name="userId"/>
<br>
<label>密码：</label>
<input type="password" name="pass"/>
<br>
<input type="submit" value="登录"/>
</form>
？表示后面是参数，参数的形式采用键值对，如userId=abc,userId是键名，abc是键值，此处的键值来自用户的输入。如果是多个参数用“&”分割。
4.7 单选按钮
<input type="radio" name="role">学生
<input type="radio" name="role" checked>教师
<input type="radio" name="role">管理员
如果需要将若干个单选按钮编为一组（一组最多只有一个被选中），需要设置相同的name属性。
如果需要默认选中某个选项，需加上checked属性
标签属性的表示形式：
（1）键值对：属性名=属性值
type="text"、maxLength="6"
（2）一些取值为布尔类型的属性直接使用属性名
checked、readonly
4.8 多选按钮
你的兴趣爱好是：
<input type="checkbox" checked>音乐
<input type="checkbox" checked>阅读
<input type="checkbox">游戏
<input type="checkbox">电影
<input type="checkbox">睡觉
<form action="http://www.baidu.com" method="get">
<h1>信息登记</h1>
<label>姓名：</label>
<input type="text" name="name" />
<br>
<label>性别：</label>
<input type="radio" name="sex" value="0"/>女
<input type="radio" name="sex" value="1" checked />男
<br>
<label>爱好</label>
<input type="checkbox" name="favorite" value="music" checked>音乐
<input type="checkbox" name="favorite" value="read" checked>阅读
<input type="checkbox" name="favorite" value="game">游戏
<input type="checkbox" name="favorite" value="film">电影
<input type="checkbox" name="favorite" value="sleep">睡觉
<br>
<input type="submit" value="提交" />
</form>
4.9 普通按钮
<input type="button" value="校验">
(1)点击按钮，没有任何的反应。
(2)value属性：value对应的值就是按键上显示的文字。
4.10 图片按钮
<input type="image" src="login.jpg" alt="登录">
（1）作用和submit按钮是一样的。
（2）需要设置src属性的值，如果src对应的路径没有找到图片，（并且有没有设置alt属性，按钮显示默认值“提交”，如果设置了alt属性则显示alt的值，类似img标签 ）。
标签：value,表单,HTML,键值,文本框,按钮,属性 来源： https://www.cnblogs.com/lize666/p/14810726.html
本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享； 2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关； 3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关； 4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除； 5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。