HTML5表单属性
来源:互联网 发布:淘宝设计团队多少人 编辑:程序博客网 时间:2024/05/29 03:36
1.<form> <input> autocomplete
属性
form或input应该有用自动完成的功能。当用户在自动完成域开始输入时,浏览器应该在该域中显示填写的选项。
点击刷新后的效果图
<form action="demo-form.php" autocomplete="on"> First name:<input type="text" name="fname"><br> Last name: <input type="text" name="lname"><br> E-mail: <input type="email" name="email" autocomplete="off"><br> <input type="submit"></form>
2.form的novaildate属性
novaildate属性是一个boolean属性。该属性规定在提交表单时不应该验证form或input域。
代码不进行验证,邮箱的格式不正确,也可以输入。
<form action="demo-form.php" novalidate>E-mail: <input type="email" name="user_email"><input type="submit"></form>
3.input autofocus属性
autofocus属性是一个boolean属性。规定在页面加载时,域自动获得焦点。
页面打开之后,光标自动定位在last name
<form action="demo-form.php" autocomplete="on"> First name:<input type="text" name="fname" ><br> Last name: <input type="text" name="lname" autofocus><br> E-mail: <input type="email" name="email" autocomplete="off"><br> <input type="submit"></form>
4.input的form属性
规定输入域所属的一个或多个表单
<form action="demo-form.php" id="form1">First name: <input type="text" name="fname"><br><input type="submit" value="Submit"></form><p> "Last name" 字段没有在form表单之内,但它也是form表单的一部分。</p>Last name: <input type="text" name="lname" form="form1">
5.input formaction属性
用于描述表单提交的url地址。该属性会覆盖form元素中的action属性。
<form action="demo-form.php"> First name: <input type="text" name="fname"><br> Last name: <input type="text" name="lname"><br> <input type="submit" value="Submit"><br>//普通的提交按钮 <input type="submit" formaction="demo-admin.php" value="Submit as admin">//提交到不同页面的按钮</form>
6.input的formenctype属性
用于表单提交到服务器的数据编码(只对form表单中method=”post”表单),该属性会覆盖form元素的enctype属性。
<form action="demo-post-enctype.php" method="post"> First name: <input type="text" name="fname"><br> <input type="submit" value="Submit">//普通的方式提交 <input type="submit" formenctype="multipart/form-data" value="Submit as Multipart/form-data">//新的编码方式提交</form>
7 input formmethod属性,定义了表单的提交方式,覆盖了form元素的method属性
<form action="demo-form.php" method="get"> First name: <input type="text" name="fname"><br> Last name: <input type="text" name="lname"><br> <input type="submit" value="Submit"> <input type="submit" formmethod="post" formaction="demo-post.php" value="Submit using POST"></form>
8 input formnovalidate属性
input元素在表单提交时不需要验证
<form action="demo-form.php"> E-mail: <input type="email" name="userid"><br> <input type="submit" value="Submit"><br>//普通的方式提交 <input type="submit" formnovalidate="formnovalidate" value="Submit without validation">//不需要验证方式的提交</form>
9.input formtarget属性
指定一个名称或一个关键字来指明表单提交数据接收后的展示
<form action="demo-form.php"> First name: <input type="text" name="fname"><br> Last name: <input type="text" name="lname"><br> <input type="submit" value="Submit as normal"> <input type="submit" formtarget="_blank" value="Submit to a new window"></form>
10.input height和width
height 和 width 属性规定用于 image 类型的<input>
标签的图像高度和宽度。 height 和 width 属性只适用于 image 类型的<input>
标签。
<input type="image" src="img_submit.gif" alt="Submit" width="48" height="48">
11.input的list属性
list属性规定输入域的datalist。datalist是输出域的选项列表。
<form action="demo-form.php" method="get"><input list="browsers" name="browser"><datalist id="browsers"> <option value="Internet Explorer"> <option value="Firefox"> <option value="Chrome"> <option value="Opera"> <option value="Safari"></datalist><input type="submit"></form>
12.input的min和max属性
min,max和step属性为包含数字或日期的input类型规定约束。
<input type="number" name="quantity" min="1" max="5">
13.input的multiple属性
该属性规定input元素中可选择多个值。
multiple属性适用于以下类型的标签:email和file。
<form action="demo-form.php"> 选择图片: <input type="file" name="img" multiple> <input type="submit"></form>
14.input的pattern属性
该属性描述了一个正则表达式用于验证input元素的值。适用于以下类型的input标签:text,search,url,tel,email,password.
<form action="demo-form.php"> Country code: <input type="text" name="country_code" pattern="[A-Za-z]{3}" title="Three letter country code"> <input type="submit"></form>
15 input的placeholder属性
placeholder属性提供一种提示,描述输入域所期待的值。输入框中默认的输入内容。
<input type="text" name="fname" placeholder="First name">
16 input的required属性
该属性是一个boolean属性,required属性规定必须在提交之前填写输入域(不能为空)
Username: <input type="text" name="usrname" required>
17 step属性
step属性为输入域规定合法的数字间隔。
- HTML5表单_表单属性
- HTML5 表单属性
- HTML5 表单属性
- HTML5表单属性
- HTML5 表单属性
- HTML5--表单属性
- HTML5表单元素属性
- HTML5 表单属性
- Html5 表单属性
- HTML5表单新增属性
- html5新增表单属性
- HTML5--form表单属性
- HTML5 Input 类型,HTML5 表单元素,HTML5 表单属性
- HTML5 Input 类型,HTML5 表单元素,HTML5 表单属性
- html5新增的表单属性
- HTML5表单属性(一)
- HTML5表单属性(二)
- HTML5表单属性(三)
- application windows are expected to have a root view controller
- 社交」到底可怕在哪儿?为什么人们会出现社交焦虑?
- android 更改api版本
- 单一职责原则
- tomcat调优
- HTML5表单属性
- Contains Duplicate II
- RabbitMQ Exchange 模式 - topic
- js异步加载的三种方案
- iOS开发Xcode6及以上版本中使用PDF格式矢量图标资源
- C++ 重载==,使用栈的非递归算法
- PHP中获取类、方法、属性
- 链表 LinkedList 问题的总结
- 【杭电oj】2099 - 整除的尾数(枚举)