js进阶正则表达式14验证邮编（input的pattern属性）（正则表达式加起^始$）
js进阶正则表达式14验证邮编（input的pattern属性）（正则表达式加起^始$）
一、总结
1、input的pattern属性：里面可以直接放正则表达式，<input type="text" id="yzbm" name="yzbm" pattern="^\d{6}$">
2、正则表达式加起^始$：var reg=/^\d{6}$/
二、js进阶正则表达式14验证邮编
练习1：验证邮政编码
- 实例描述：
验证用户的邮政编码是否合法。
- 案例要点：
字符串中的内容必须是数字
位数必须是6位。
- HTML5 中的新属性 pattern。
pattern 属性规定用于验证输入字段的模式。
pattern 属性适用于以下 input 类型：text, search, url, telephone, email 以及 password 。
三、代码
<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="utf-8">
<title>验证邮政编码</title>
<style type="text/css">
li{
font-size: 20px;
width: 500px;
background: rgba(0,180,80,0.3);
padding: 10px;
margin: 10px;
} </style>
</head>
<body>
<form name='myform' action=" " method="get" onsubmit="check()">
邮政编码：<input type="text" id="yzbm" name="yzbm">
<input type="submit"> <input type="reset" value="重置">
</form> <br>
<script type="text/javascript">
function check(){
var str=document.getElementById('yzbm').value;
//var str=myform.yzbm.value;
//alert(str)
var reg=/^\d{6}$/ //1、正则表达式加起始
if (reg.test(str)) {
alert('格式正确')
}else{
alert('格式不正确，请重新输入')
}
}
</script>
<form name='myform' action="reg.php" method="post">
邮政编码：<input type="text" id="yzbm" name="yzbm" pattern="^\d{6}$"> //2、input的pattern属性：里面可以直接放正则表达式
<input type="submit"> <input type="reset" value="重置">
</form>
</body>
</html>
js进阶正则表达式14验证邮编（input的pattern属性）（正则表达式加起^始$）的更多相关文章
- js进阶-9-3/4 form对象有哪些常用属性
js进阶-9-3/4 form对象有哪些常用属性 一.总结 一句话总结: 1.一般html标签有哪些常用属性:name id value 2.form对象有哪些常用属性(特有):action meth ...
- html5中 input的pattern属性 和 details/summary元素
html5--3.21 课程小结与其他新增元素 一.总结 一句话总结: input的pattern属性可以设置正则验证,比如检测学号的位数和数字区间 details/summary元素配合起来可以做元 ...
- 正则表达式获取字符串的input标签的属性值
直接上正则表达式: (?<=\<input.*value=\").*?(?=\") 字符串如下: <form action="https://www.b ...
- js进阶正则表达式15验证身份证号（|符号的使用：var reg=/^\d{17}[\d|X]$|^\d{15}$/）（str的方法substr）
js进阶正则表达式15验证身份证号(|符号的使用:var reg=/^\d{17}[\d|X]$|^\d{15}$/)(str的方法substr) 一.总结 1.|符号的使用:var reg=/^\d ...
- js进阶 14-2 如何用ajax验证登陆状态（这里用load方法）
js进阶 14-2 如何用ajax验证登陆状态(这里用load方法) 一.总结 一句话总结:$('#test').load('test.php?password=1234560'),这样就get方式提 ...
- ASP.NET开发中主要的字符验证方法-JS验证、正则表达式、验证控件、后台验证
ASP.NET开发中主要的字符验证方法-JS验证.正则表达式.验证控件.后台验证 2012年03月19日 星期一 下午 8:53 在ASP.NET开发中主要的验证方法收藏 <1>使用JS验 ...
- JS通用表单验证函数,基于javascript正则表达式
表单的验证在实际的开发当中是件很烦琐又无趣的事情今天在做一个小项目的时候,需要JS验证,寻找到一个比较好的东西 地址如下: http://blog.csdn.net/goodfunman/archiv ...
- js进阶正则表达式实现过滤字符串（RegExp对象操作正则表达式）（正则：regular）（表达式：expression）
js进阶正则表达式实现过滤字符串(RegExp对象操作正则表达式)(正则:regular)(表达式:expression) 一.总结 1.str_replace:正则作用:高效快速匹配 2.break ...
- js进阶正则表达式13RegExp对象方法（RegExp对象的方法：compile，test，exec）（子表达式 var reg1=/([a-z]+)\d/）
js进阶正则表达式13RegExp对象方法(RegExp对象的方法:compile,test,exec)(子表达式 var reg1=/([a-z]+)\d/) 一.总结 1.RegExp对象有三个方 ...
随机推荐
- IPod在Linux下的实战
刚收到一个朋友送的Ipod,经过研究今天我为大家分享一点在Linux系统下使用的经验.Apple的iPod它炫目时尚,超薄还可以俘储大量歌曲,这使得iPod十分流行.但流行的同时也带来了一些问题, 在 ...
- 一个小的考试系统 android 思路
一个小的考试系统 android 思路 假如有 100 组,每组有4个单选钮,设置超时检测确认后去测结果估分视图去切换,如果还有,就再显示下一组 所有结束就给个总结显示 有超时结束过程加上 提示正确选 ...
- 二维LIS（CDQ分治）
题目描述 给定一个长度为N的序列S,S的每个元素pi是一个二元组(xi,yi),定义pi<pj当且仅当xi<xj并且yi<yj,求S的最长上升子序列长度 输入格式 第一行一个N,表示 ...
- 【例题 8-4 UVA - 11134】Fabled Rooks
[链接] 我是链接,点我呀:) [题意] 在这里输入题意 [题解] 显然把问题分解成两个子问题. x轴和y轴分别做. 即n个点要求第i个点在[li,ri]范围内.(ri<=n) 问是否可行. 按 ...
- animation- 动画效果实现（代码中）
1,首先我们看一下如下的代码 import android.view.animation.LayoutAnimationController; import android.view.animatio ...
- 97.TCP通信
运行截图: 客户端 创建通信套接字 //通信套接字,用于创建TCP连接 SOCKET socket_send; 创建tcp通信 //创建tcp通信 socket_send = socket(AF_IN ...
- django 简单会议室预约（2）
--我们先打开settings.py 配置文件: import os #指明django APP目录路径 BASE_DIR = os.path.dirname(os.path.dirname(os.p ...
- MySQL系列之七：主从复制(转)
一:实验环境 IP 操作系统 mysql版本号 master 192.168.25.11 CentOS7 5.6.35 slave 192.168.25.10 win10 5.7.18 slave版本 ...
- 页面事件(Init,Load,PreRender)执行顺序
简介 对由 Microsoft® Internet 信息服务 (IIS) 处理的 Microsoft® ASP.NET 页面的每个请求都会被移交到 ASP.NET HTTP 管道.HTTP 管道由一系 ...
- 关于jsonp跨域的问题以及解决方法(跨域、同源与非同源)
什么是跨域? 想要了解跨域,首先需要了解下浏览器的同源机制: JSONP和AJAX相同,都是客户端向服务器端发送请求:给服务器端传递数据 或者 从服务器端获取数据 的方式 JSONP属于非同源策略(跨 ...