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 ...
随机推荐
- (Java)利用ListIterator(iterator 重复器/迭代器的子接口) 操作ArrayList
add()方法是在下一个将要取得的元素之前插入新的元素.因此如果在下一个将要取得的元素的序号为0,则在序号0的元素前插入新的元素. 测试: 见第1.行,在序号为0的元素前添加一个元素. 见第2.行:这 ...
- 通达信自动交易软件 z
1.要善用spy++ 2.不同的控件主要靠GetDlgCtrlID去区分 3.要获得另一个进程的焦点窗口(GetFocus)需要调用AttachThreadInput 4.尽量少用keybd_even ...
- (二)GameMaker:Studio ——使用等高图生成3D地形
上一篇,我们讲解了GM中导入模型的方法,这节我们来讲地形. 源文件地址:http://pan.baidu.com/share/link?shareid=685772423&uk=2466343 ...
- Stm32外围模块编程初始化步骤
Stm32外围模块编程初始化步骤: 一.外部中断 1)初始化 IO 口为输入. 这一步设置你要作为外部中断输入的 IO 口的状态,可以设置为上拉/下拉输入,也可以设置为浮空输入,但浮空的时候外部一定要 ...
- bzoj 3932 [CQOI2015]任务查询系统(主席树)
Description 最近实验室正在为其管理的超级计算机编制一套任务管理系统,而你被安排完成其中的查询部分. 超级计算机中的任务用三元组(Si,Ei,Pi)描述,(Si,Ei,Pi)表示任务从第Si ...
- k-近邻分类的Python实现
参见<机器学习实战> # -*- coding:cp936 -*- #=========================================================== ...
- minicom 没有tx 信号
在minicom -s 的配置中:——> Serial port setup --> 选择F - Hardware Flow Control : No默认是yes, 但是没有tx信号输出 ...
- PCb过孔大小设置 / 丝印层字符尺寸设置
PCb过孔大小一般设置为:内孔(孔尺寸)0.30(12mil),外壳(直径)0.6(24mil) 常用过孔设置: 内径: 15mil(0.381mm) 30mil(0.762mm) 外径: 20mi ...
- [iOS基础控件 - 6.8] 各种数据类型的@property属性
A.内存管理 NSString: copy 基本数据类型.结构体(int, CGFloat, BOOL, CGRect等):assign 对象(如自定义model类型.NSArray.NSDictio ...
- After Android Studio update: Gradle DSL method not found: 'runProguard()'
1 具体报错为: Error:(16, 0) Gradle DSL method not found: 'runProguard()' Possible causes:<ul><li ...