html5 list属性、autocomplete属性、pattern属性
list属性的值为某个datalist元素的id,datalist也是html5中新增的属性,类似于选择框select,或者android中的autocomplete textview控件。datalist本身在页码中并不显示,其display属性应设为none,而是以input元素的输入提示的方式显示。
<input type='text' list='hello' autocomplete="on" /> <datalist id='hello' style='display:none;'> <option value='Hello'>Hello</option> <option value='Hello2'>Hello2</option> <option value='Hello3'>Hello3</option> <option value='Good'>Good</option> </datalist> autocomplete属性则可以在提交form再次回到次页面时自动填写上次提交的数据。pattern属性可以对input元素的输入进行检查,将属性值设置为某个格式的正则表达式,提交表单时会对该input进行检查,若不符合该表达式则不允许提交。<form><input type='text' pattern='[1-9][0-9]{12}'>//输入的第一位为1-9之间的某个数字,其余位为0-9之间的某个数字</form>
html5 list属性、autocomplete属性、pattern属性的更多相关文章
- HTML5 中的新属性autocomplete="off"失效的解决方法(兼容firefox,IE,360)
因为业务需求,在写一个注册页面的时候,发现浏览器会自动填充此域名下已经保存的账号密码,给用户带来不便.加了HTML5 中的新属性autocomplete="off" ,但是并没有产 ...
- 一些有用的HTML5 pattern属性
最近在做手机页面时,遇到数字输入的键盘的问题,之前的做法只是一刀切的使用 type="tel",不过一直觉得九宫格的电话号码键盘上的英文字母太碍事了.于是想要尝试其它的实现方案,最 ...
- 常用的HTML5 pattern属性
type="tel" 和 type="number" 的区别 这里还是先那么先交代一下最初遇到的问题.其实无论是tel还是number都不是完美的: type= ...
- html5中 input的pattern属性 和 details/summary元素
html5--3.21 课程小结与其他新增元素 一.总结 一句话总结: input的pattern属性可以设置正则验证,比如检测学号的位数和数字区间 details/summary元素配合起来可以做元 ...
- 疯狂的表单-html5新增表单元素和属性
疯狂的表单 2015/11/27 16:44:07 从三方面来介绍html5表单的新特性 表单结构更灵活 要提交数据的控件可以布局在form标签之外,看下面的代码,表单元素可以写到form元素之外,只 ...
- HTML5新增的属性和废除的属性
HTML5中,在新增加和废除很多元素的同时,也增加和废除了很多属性. 新增的属性 1.表单相关的属性 对input(type=text).select.textarea与button指定autofoc ...
- HTML5表单新增元素与属性
form属性 在html4中,表单的从属元素必须写在表单内部,而在HTML5中,可以把他们书写在任何地方,然后为该元素指定一个form属性,属性值为该表单的id,这样就可以声明该元素从属于指定表单了. ...
- html5表单新增元素与属性2
1.标签的control属性 在html5中,可以在标签内部放置一个表单元素,并且通过该标签的control属性来访问该表单元素. <script> function setValue() ...
- HTML5 的新的表单属性
本章讲解涉及 <form> 和 <input> 元素的新属性. 新的 form 属性: autocomplete novalidate 新的 input 属性: autocom ...
随机推荐
- Explain 结果解读与实践
Explain 结果解读与实践 基于 MySQL 5.0.67 ,存储引擎 MyISAM . 注:单独一行的"%%"及"`"表示分隔内容,就象分开“第一章”“第 ...
- VS2010 Chromium编译
推荐使用Windows 7及以后系统,最少8G内存,预留出50G磁盘空间 搭建Visual Studio 2010开发环境 1.安装Visual Studio 2010专业版或者旗舰版 2.安装VS2 ...
- DDraw绘图
微软已经提供了GDI+绘图方式,但是GDI+绘图较慢,另外微软提供了效率更高的DirectDraw绘图方式.DirectDraw提供硬件加速功能. 首先需要确保电脑上的Ddraw硬件加速功能已经打开, ...
- [转]VPN服务器配置详解
借助VPN,企业外出人员可随时连到企业的VPN服务器,进而连接到企业内部网络.借助windows2003的“路由和远程访问”服务,可以实现基于软件的VPN. VPN(Virtual Private N ...
- Stm32外围模块编程初始化步骤
Stm32外围模块编程初始化步骤: 一.外部中断 1)初始化 IO 口为输入. 这一步设置你要作为外部中断输入的 IO 口的状态,可以设置为上拉/下拉输入,也可以设置为浮空输入,但浮空的时候外部一定要 ...
- uvalive 4513 Stammering Aliens
题意:给你一个串,问期中至少出现m次的最长子串及其起始位置的坐标. 思路:hash+LCP+二分答案 #include<cstdio> #include<cstring> #i ...
- python的资料
python2.7的类库:https://docs.python.org/2.7/library/index.html
- Fragment详解
1 Fragment简介 1.1 Fragment的设计初衷 Android3.0引入Fragment的初衷是为大屏幕的设备提供更加灵活的动态UI设计,由于大屏设备可以容纳更多的UI组件,且这些UI组 ...
- 类型检测汇总!typeof 和 instanceof 和isArray
, ]; alert(arr instanceof Array);//true 以上老方法判断是否是数组,存在一个问题,就是它只适用于单执行环境(窗口),如果该窗口有其他框架(比如 iframe)则会 ...
- JNI-使用RegisterNatives注册本地方法
转自: http://blog.chinaunix.net/uid-26009923-id-3410141.html 1. 以前在jni中写本地方法时,都会写成 Java_com_example_he ...