html5表单验证(Bootstrap)
html5表单验证(Bootstrap)
邮箱验证:
<input name="email" type="text" placeholder="必填项" class="input-xlarge" required pattern="^\w+((-\w+)|(\.\w+))*\@[A-Za-z0-9]+((\.|-)[A-Za-z0-9]+)*\.[A-Za-z0-9]+$"
title="邮箱正确格式:xxx@xxx.xxx">
密码验证:
<div class="control-group">
<label class="control-label">
密码</label>
<div class="controls">
<input id="pwd" name="pwd" type="password" placeholder="必填项" class="input-xlarge"
required onchange="checkPasswords()">
</div>
</div>
<div class="control-group">
<label class="control-label">
确认密码</label>
<div class="controls">
<input id="pwd1" name="pwd1" type="password" placeholder="必填项" class="input-xlarge"
required onchange="checkPasswords()">
</div>
</div>
验证方法:
<script>
function checkPasswords() {
var passl = document.getElementById("pwd");
var pass2 = document.getElementById("pwd1");
if (passl.value != pass2.value)
passl.setCustomValidity("两次密码必须输入一致!");
else
passl.setCustomValidity('');
}
function check() {
document.getElementById('ok').disabled = 'disabled';
}
</script>
html5表单验证(Bootstrap)的更多相关文章
- html5表单验证
表单验证为终端用户检测无效的数据并标记这些错误,是一种用户体验的优化. 下面展现浏览器自带的验证功能也可在移动端中查看: HTML部分: <!DOCTYPE html> <html ...
- 实现跨浏览器html5表单验证
div:nth-of-type(odd){ float: left; clear: left; } .origin-effect > div:nth-of-type(even){ float: ...
- jQuery html5Validate基于HTML5表单验证插件
更新于2016-02-25 前面提到的新版目前线上已经可以访问: http://mp.gtimg.cn/old_mp/assets/js/common/ui/Validate.js demo体验狠狠地 ...
- HTML5表单验证(4个实用的表单美化案例)
multipart/form-data 在使用包含文件上传控件的表单时,必须使用autocomplete="on" 自动补全功能novalidate 不验证 <form en ...
- HTML5 web Form表单验证实例
HTML5 web Form 的开发实例! index.html <!DOCTYPE html> <html> <head> <meta charset=&q ...
- [H5表单]html5自带表单验证体验优化及提示气泡修改
慕课网之前录制的视频,js/jquery各种宽高的理解和应用,最近终于上线了.还有一个html5左侧导航没有上线!最近慕课网系列课程让我录制一个html5表单验证的课程.今天就稍微说一下表单验证!另外 ...
- HTML5中表单验证的8种方法(转)
在深人探讨表单验证之前,让我们先思考一下表单验证的真实含义.就其核心而言,表单验证是一套系统,它为终端用户检测无效的控件数据并标记这些错误.换言之,表单验证就是在表单提交服务器前对其进行一系列的检查并 ...
- AngularJS复习------表单验证
在AngularJS中能够将HTML5表单验证功能同自己的验证指令结合起来使用,这里介绍使用的核心功能. 使用表单验证,首先要确保表单的每个控件都有name属性 如果想要屏蔽浏览器对表单的默认验证行为 ...
- AangularJS的表单验证
Angular能够将HTML5表单验证功能同它自己的验证指令结合起来使用 Angular提供了很多表单验证指令: 1. 必填项:验证表单输入是否填写,只需在html标签上标记required 如: ...
随机推荐
- Selenium2+python自动化54-unittest生成测试报告(HTMLTestRunner)【转载】
前言 批量执行完用例后,生成的测试报告是文本形式的,不够直观,为了更好的展示测试报告,最好是生成HTML格式的. unittest里面是不能生成html格式报告的,需要导入一个第三方的模块:HTMLT ...
- C# T4使用
最近升级我们的框架到微服务了,而且是dotnetcore 2.0. 然后一个新的框架,最基本的Model和与数据库交互的Repository,我们都是要利用T4自动生成的. 首先这个是代码结构,在这个 ...
- C# DataGridView分页显示
//导入命名空间部分省略 DBClass.DBExecute dbexecute = new DBExecute(); string connectionString = @"Data So ...
- AVR单片机中的EEPROM
1.EEPROM介绍 Electrically Erasable Programmable Read Only Memory 电气可拭除可编程只读存储器 发展过程:ROM – > PROM –& ...
- js跳转整理(简记)
location.replace(URL)跳转脱离历史记录流: location.href=url;在历史记录中 子刷新父级 parent.location.replace(parent.locati ...
- Codeforces Round #442 A Alex and broken contest【字符串/常量数组/string类】
A. Alex and broken contest time limit per test 2 seconds memory limit per test 256 megabytes input s ...
- pthread条件变量
pthread条件变量等待条件有两种方式:无条件等待pthread_cond_wait()和计时等待pthread_cond_timedwait(),其中计时等待方式如果在给定时刻前条件没有满足,则返 ...
- 数字 function
SELECT TRUNC(15.79), TRUNC(), ROUND(15.79), ), ), FLOOR(26.983), CEIL(26.123), ), ), ), MOD(,) FROM ...
- 加密连接工具Cryptcat
加密连接工具Cryptcat Cryptcat是网络工具Netcat的加密版本.Cryptcat支持TCP.UDP两种网络协议.它可以在两个计算机之间建立指定的连接,并使用特定的密钥对传输数据进行 ...
- 微信小程序开发教程(八)视图层——.wxml详解
框架的视图层由WXMKL(WeiXin Markup language)与WXSS(WeiXin Style Sheet)编写,由组件进行展示. 对于微信小程序而言,视图层就是所有.wxml文件与.w ...