当前位置:   article > 正文

h5表单验证

h5表单验证

from

1.action URL后台交互   method  placeholder灰色字 

2.提交文件 enctype =“mlutipart/from-data”    input type =“file”

3.下拉框的提示 input list=“tips”   dataList id=“tips”   option value=“”

 4.required 必填

5.autocomplete =“off” on 下面的联想

6.pattern 正则:^开头 /d{5}五个数字[任意字母]$结尾

7.焦点autofocus

8.novalidate 表单上不验证       type submit   按钮上fromnovalidate验证

9. label for=“man”

input type radio  name=“sex” id=“man”

10.h5约束验证 API

willValidate属性:不符合返回false

validity属性:验证状态  validityState对象

watermark,type_d3F5LXplbmhlaQ,shadow_50,text_Q1NETkB3ZWl4aW5fNTMxNTM0NDg,size_20,color_FFFFFF,t_70,g_se,x_16

 

validationMessage属性:失败信息

checkValidity()方法 符合返回ture可写自定义信息 

setCustomValidity()方法设置自定义提示信息

11.search里的伪元素style input[type=“search”]::

- webkit- search- cancel- button{

- webkit- appearance:none}

取消谷歌pc端自带的差号样式

移动端用div的绝对定位

12.number   max 和min  step保留两位小数0.01

maxlength不可用

用js  oninput实时监听事件 函数里用obj 和length  obj.value=obj.value.substr(0,length)

this   =obj

13.number里的伪元素   取消上下增减

input[type=number]::- webkit- inner-spin- button,- webkit- outer-spin- button{

- webkit- appearance:none;

 margin:0;

14.h5自带验证美化

常见伪类1.:required  :optional选填

2.:in-range :out -of -range 范围-最值大小r

3.valid和 invalid 符合和不符合验证

4.:read-only :read- write也可匹配div的contenteditable属性可写的

 

 

 

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/从前慢现在也慢/article/detail/110873?site
推荐阅读
相关标签
  

闽ICP备14008679号