14.2.4HTML5约束API验证
<body>
<form>
<!--
required属性在提交表单时不能空着
这个属性适用于<input> <textarea> <select>
-->
<input type='text' name='username' required>
<!--
email和url是两个得到支持的最多的类型
email只允许输入符合电子邮件的格式
url只允许输入的文本支持浏览器的格式
-->
<input type='email' name='email'>
<input type='url' name='homepage'>
<!--
number类型，只允许输入数字，但是也可以输入不符的类型，但是提交的时候会
提示错误，min是数的最小值，max最大值，step进位
-->
<input type='number' min='0' max='100' step='5' name='count' >
<!--
pattern 正则格式，允许表单输入的格式
-->
<input type='text' pattern="\d+" name='number' >
<!--
submit提交
-->
<input type='submit' value='提交' name='sub'>
</form>
<script>
//检测表单字段是否是必填的
var isUsernameRequired = document.forms[0].elements['username'].required;
console.log( isUsernameRequired );//true
//检测是否支持required
var isRequriedSupported = 'required' in document.createElement('input');
console.log( isRequriedSupported );// var count = document.forms[0].elements['count'];
var sub = document.forms[0].elements['sub'];
for (var i in document.forms[0])
{
console.log(i+' : '+document.forms[0][i])
}
sub.onclick = function(){
//表单验证，只要有一个表单无效，就返回false
if (document.forms[0].checkValidity())
{
alert('表单有效');
}else{
alert('表单无效');
} } </script>
</body>
5、检测有效性
customError：如果设置了setCustomValidity(),则为true，否则返回false。
6、禁用验证
通过设置novalidate属性
<form method='post' action='signup.php' novalidate>
<!--这里插入表单元素-->
</form>
如果一个表单中有多个提交按钮，为了制定点击某个提交按钮不必验证表单，可以在相应的按钮上添加formnovalidate
<form>
<!--这里插入表单元素-->
<input type='submit' value='Regular Submit'>
<!--
formnovalidate指定某个提交按钮不必验证表单
-->
<input type='submit' formnovalidate name='btnNoValidate' value='Non-validating Submit'>
</form>
14.2.4HTML5约束API验证的更多相关文章
- python API验证
API验证 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 API验证: a. 发令牌: 静态 PS: 隐患 key ...
- API验证及AES加密
API验证 API验证: a. 发令牌: 静态 PS: 隐患 key被别人获取 b. 动态令牌 PS: (问题越严重)用户生成的每个令牌被黑客获取到,都会破解 c. 高级版本 PS: 黑客网速快,会窃 ...
- CMDB服务器管理系统【s5day90】：API验证
1.认证思路刨析过程 1.请求头去哪里拿? 1.服务器端代码: def test(request): print(request) return HttpResponse('你得到我了') 2.客户端 ...
- API验证插件
前言 如果在访问某WebAPI过程中request信息被他人截获,若是get请求获取数据还好,如果是post提交数据,势必威胁数据安全,所以对于一个对安全性要求较高的API来说,对每个请求做身份验证显 ...
- API验证
API验证说明 API验证: a. 发令牌: 静态 PS: 隐患 key被别人获取 b. 动态令牌 PS: (问题越严重)用户生成的每个令牌被黑客获取到,都会破解 c. 高级版本 PS: 黑客网速快, ...
- 基于 JWT-Auth 实现 API 验证
基于 JWT-Auth 实现 API 验证 如果想要了解其生成Token的算法原理,请自行查阅相关资料 需要提及的几点: 使用session存在的问题: session和cookie是为了解决http ...
- CMDB 数据加密 最终整合API验证+AES数据加密
当CMDB运行在内网的时候,经过API验证的三关是没有问题的,但是如果运行在外网,有一个问题是,黑客截取后的访问速度比客户端快的时候还会造成数据泄露.为了解决这个问题,就要对数据进行加密 RSA加密 ...
- CMDB API验证
CMDB API验证 为什么做API验证 API验证是防止数据在传输的过程中,保证数据不被篡改 如何设计的API验证 灵感来源于Torando中加密Cookie的源码,主要是生成加密的随机字符串. M ...
- Java 9 揭秘（14. HTTP/2 Client API）
Tips 做一个终身学习的人. 在此章中,主要介绍以下内容: 什么是HTTP/2 Client API 如何创建HTTP客户端 如何使HTTP请求 如何接收HTTP响应 如何创建WebSocket的e ...
随机推荐
- WordPress版微信小程序2.4版发布
自从发布2017年9月16日WordPress版微信小程序2.2.8版本后,这个一个多月来,WordPress版微信小程序,在经过一些比较小的更新后,今天发布阶段性的版本:2.4版 .这版本主要是功能 ...
- C语言数据结构基础学习笔记——基础线性表
线性表是指具有相同数据类型的n(n>=0)个数据元素的有限序列,它具有一个表头元素和一个表尾元素,并且每一个数据元素最多只有一个直接前驱和一个直接后继. 线性表的顺序存储也叫作顺序表,它的特性是 ...
- Java笔记Spring（四）
spring web项目启动入口 1.首先看一下传统Java Web的配置文件web.xml,网上找的一个,参考地址:https://blog.csdn.net/github_36301064/art ...
- Laravel常见问题集锦
1.提示:Syntax error or access violation: 1071 Specified key was too long; max key length is 767 bytes? ...
- 学习笔记：SASS
SASS: http://www.sass.hk/sass-course.html SASS 2015-10-10 http://sass.bootcss.com/docs/sass-referen ...
- @ResponseBody 与 response.getWriter.write
@responseBody注解的使用 1. @responseBody注解的作用是将controller的方法返回的对象通过适当的转换器转换为指定的格式之后,写入到response对象的body区,通 ...
- java 集合是否有序
参考:https://www.cnblogs.com/hoobey/p/5914226.html
- 判断URL是否能被链接
判断url是否能被正确链接 function checkUrl(url, name) { $.ajax({ url: url, type: "get", dataType : 'j ...
- C++ queue
queuequeue 模板类的定义在<queue>头文件中.与stack 模板类很相似,queue 模板类也需要两个模板参数,一个是元素类型,一个容器类型,元素类型是必要的,容器类型是可选 ...
- Java JDK 在Windows 10中配置环境变量
首先,去Oracle官方网站下载Java JDK https://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-213 ...