javascript遇到html5的一些表单属性

前端之家收集整理的这篇文章主要介绍了javascript遇到html5的一些表单属性前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

input属性: placeholder:输入框的默认值,向用户显示描述性说明文字或者提示信息

autocomplete:值为on和off。。on则代表当该字段填写并提交后再返回该页,再输入时会显示以前输入的。off则是关闭,包含用户输入数据的安全。默认为on autofocus:页面载入时设置某个input自动获取焦点,注意该页面只能设置一个input的这个属性,设置多个相当于没有设置。 list特性和datalist:通过list为某个输入框增加下拉列表。。相当于js实现的“自动完成”功能,但是不能进行模糊查询 如果datalist内有2项值:"a34343"和"并24234",用户希望的是输入了3后这2个值都出现,但实际上一个也不出现。 它要求是完全匹配,比如输入a,则下拉a34343出现,接着输入4,那么这个下拉值也就没有了。

required:表单提交前该元素必须填写,即不能为空。不建议使用,因为提示信息‘请填写此字段',除非有属性可以代替该提示信息。 pattern:给input标签内写正则的地方。。type为email或url的输入控件内置相关正则表达式,如果value不符合其正则表达式,那表单将通不过验证,无法提交。。 不建议给type为email或url的元素使用,因为提示信息固定,正则固定。。还不如js直接重写。

一些输入设置: rangeUnderflow 限制数值控件的最小值 设置min, input type="number" min="0" value="20" rangeOverflow 限制数值控件的最大值 设置max,input type="number" max="100" value="20" stepMismatch 确保输入值符合min,max,step的设置 设置max min step, input type="number" min="0" max="100" step="10" value="20"

下面是input=number用的一个小函数

list特性和datalist:

<form action="http://localhost/test.PHP" method="post" id="register">
url:

user:<input type="text" name="user" value="" form="register"/>

pwd:

<select name="year" form="register">
<option value="1970">1970
<option value="1980">1980
<option value="1990">1990

注册" form="register"/>

正则:

邮箱:
地址: TIME: 周: 数字:
滑动条搜索 :

自动填充表单

11111111

输出表单output

以上所述就是本文的全部内容了,希望大家能够喜欢。

原文链接:https://www.f2er.com/js/53517.html

猜你在找的JavaScript相关文章