HTML表单用于收集不同类型的用户输入。HTML5Input具有多种新的表单输入类型,可提供更好的输入控制和验证。
html表单制作及实例
表格标签:表格
表单标签的主要功能是在HTML页面中创建表单,并在用户填写表单信息后将数据提交到服务器。需要填写数据的标签必须放在表单标签主体中。
常用属性:
行动:在此属性中确定请求路径,表单数据提交的服务器地址。
方法:请求方法。常用的请求方法是:获取,发布。
获取(默认):1.获取的请求数据受到限制
2.提交的表单数据将附加到请求的路径,例如:regist.action?username=jack&password=1111。
追加是在请求地址后添加?Connect。每对数据使用并连接之后。
发布:1.提交的数据将不会添加到请求路径,也不会显示在地址栏上。
2.从理论上讲,该职位要求的数据量是无限的。
输入字段标签:输入
输入字段标签用于获取用户输入的信息。类型属性值不同,并且获取它的方式也不同。
共同属性:
类型属性
文本:文本框,单行输入字段,用户可以在其中输入文本,
密码:密码框,在输入框中输入的字符将显示为黑色圆圈。
单选按钮:单选按钮,代表一组互斥的选项按钮之一。选择一个按钮后,上一个按钮将变为未选择状态。
复选框:多选按钮。
文件:文件上传组件
隐藏:隐藏字段,数据将发送到服务器,但浏览器不会显示。
重置:重置按钮可将表格恢复为默认值。
提交:“提交”按钮,“提交”按钮会将表单数据发送到服务器。
名称属性:元素名称,必须提供名称属性,表单数据将提交到服务器。服务器使用此值获取数据。
value属性:设置输入标签的默认值,
Size属性:设置输入框的大小
选中属性:单选按钮或复选框已选中。
只读:是否为只读。
禁用:是否可用。
下拉列表标签:选择
下拉列表标签,提供了一些选项以选择其中一个或多个。它需要与子标签<option>一起使用。
名称属性:设置名称,一个必填项。
多属性:不写默认的单选,多选的值表示多选。
大小属性:进行多项选择时可见选项的数量。
子标签<option>:下拉列表中的一个选项
已选:选择当前列表项。
value:发送到服务器的选项值。
示例代码:
<!DOCTYPEhtml>
<html>
<head>
<metacharset=”UTF-8″>
<title>表单标签</title>
</head>
<body>
<!–要提交到服务器中的所有信息,必须要用form标签包裹起来–>
<form>
<!–文本输入项–>
用户名:<inputtype=”text”name=”usernam”/><br/>
<!–密码项–>
密 码:<inputtype=”password”name=”password”/><br/>
确认密码:<inputtype=”password”name=”password2″/><br/>
<!–单选按钮–>
性别:<inputtype=”radio”name=”sex”/>男
<inputtype=”radio”name=”sex”/>女<br/>
<!–多选按钮–>
兴趣爱好:<inputtype=”checkbox”name=”hobby”/>写博客
<inputtype=”checkbox”name=”hobby”/>写代码
<inputtype=”checkbox”name=”hobby”/>看源码<br/>
<!–文件选项–>
文件:<inputtype=”file”name=”file”/><br/>
<!–下拉列表标签–>
居住城市:<selectname=”city”>
<option>–请选择–</option>
<option>北京</option>
<option>上海</option>
<option>广州</option>
</select><br/>
<!–提交按钮–>
<inputtype=”submit”value=”提交按钮”/><br/>
<!–普通按钮–>
<inputtype=”button”value=”普通按钮”/><br/>
<!–重置按钮–>
<inputtype=”reset”value=”重置”/><br/>
</form>
</body>
</html>
1、IT大王遵守相关法律法规,由于本站资源全部来源于网络程序/投稿,故资源量太大无法一一准确核实资源侵权的真实性;
2、出于传递信息之目的,故IT大王可能会误刊发损害或影响您的合法权益,请您积极与我们联系处理(所有内容不代表本站观点与立场);
3、因时间、精力有限,我们无法一一核实每一条消息的真实性,但我们会在发布之前尽最大努力来核实这些信息;
4、无论出于何种目的要求本站删除内容,您均需要提供根据国家版权局发布的示范格式
《要求删除或断开链接侵权网络内容的通知》:https://itdw.cn/ziliao/sfgs.pdf,
国家知识产权局《要求删除或断开链接侵权网络内容的通知》填写说明: http://www.ncac.gov.cn/chinacopyright/contents/12227/342400.shtml
未按照国家知识产权局格式通知一律不予处理;请按照此通知格式填写发至本站的邮箱 wl6@163.com