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属性)(正则表达式加起^始$)的更多相关文章

  1. js进阶-9-3/4 form对象有哪些常用属性

    js进阶-9-3/4 form对象有哪些常用属性 一.总结 一句话总结: 1.一般html标签有哪些常用属性:name id value 2.form对象有哪些常用属性(特有):action meth ...

  2. html5中 input的pattern属性 和 details/summary元素

    html5--3.21 课程小结与其他新增元素 一.总结 一句话总结: input的pattern属性可以设置正则验证,比如检测学号的位数和数字区间 details/summary元素配合起来可以做元 ...

  3. 正则表达式获取字符串的input标签的属性值

    直接上正则表达式: (?<=\<input.*value=\").*?(?=\") 字符串如下: <form action="https://www.b ...

  4. 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 ...

  5. js进阶 14-2 如何用ajax验证登陆状态(这里用load方法)

    js进阶 14-2 如何用ajax验证登陆状态(这里用load方法) 一.总结 一句话总结:$('#test').load('test.php?password=1234560'),这样就get方式提 ...

  6. ASP.NET开发中主要的字符验证方法-JS验证、正则表达式、验证控件、后台验证

    ASP.NET开发中主要的字符验证方法-JS验证.正则表达式.验证控件.后台验证 2012年03月19日 星期一 下午 8:53 在ASP.NET开发中主要的验证方法收藏 <1>使用JS验 ...

  7. JS通用表单验证函数,基于javascript正则表达式

    表单的验证在实际的开发当中是件很烦琐又无趣的事情今天在做一个小项目的时候,需要JS验证,寻找到一个比较好的东西 地址如下: http://blog.csdn.net/goodfunman/archiv ...

  8. js进阶正则表达式实现过滤字符串(RegExp对象操作正则表达式)(正则:regular)(表达式:expression)

    js进阶正则表达式实现过滤字符串(RegExp对象操作正则表达式)(正则:regular)(表达式:expression) 一.总结 1.str_replace:正则作用:高效快速匹配 2.break ...

  9. js进阶正则表达式13RegExp对象方法(RegExp对象的方法:compile,test,exec)(子表达式 var reg1=/([a-z]+)\d/)

    js进阶正则表达式13RegExp对象方法(RegExp对象的方法:compile,test,exec)(子表达式 var reg1=/([a-z]+)\d/) 一.总结 1.RegExp对象有三个方 ...

随机推荐

  1. 创建VG

    创建VG smit mkvg Add a Volume Group Add a Scalable Volume Group   VOLUME GROUP name                    ...

  2. BZOJ3620: 似乎在梦中见过的样子(KMP)

    Description “Madoka,不要相信 QB!”伴随着 Homura 的失望地喊叫,Madoka 与 QB 签订了契约. 这是 Modoka 的一个噩梦,也同时是上个轮回中所发生的事.为了使 ...

  3. 【Uva 11080】Place the Guards

    [Link]: [Description] 一些城市,之间有道路相连,现在要安放警卫,警卫能看守到当前点周围的边,一条边只能有一个警卫看守,问是否有方案,如果有最少放几个警卫. [Solution] ...

  4. CODEVS——T1979 第K个数

    http://codevs.cn/problem/1979/ 时间限制: 1 s  空间限制: 1000 KB  题目等级 : 黄金 Gold 题解  查看运行结果     题目描述 Descript ...

  5. ubuntu14中 memcached安装与使用

    第一步,先安装lib-event 下载lib-event  的包http://libevent.org/ 下载完之后,解压安装 ./configure –prefix=/usr (或 ./config ...

  6. ViewPager+Fragmrnt最简单结合方法

    Fragment和ViewPager 本博文系本菜鸟第一次博文展示,有错误之处请虽然提出 FragmentPagerAdapter 谷歌官方提供了这么一个adapter(FragmentPagerAd ...

  7. Microsoft SQL Server Version List(SQL Server 版本)

    原帖地址 What version of SQL Server do I have? This unofficial build chart lists all of the known Servic ...

  8. 用c实现的各种排序的方法

    #include <stdio.h> void swap(int *a, int *b); void bubble_sort(int a[], int n); void select_so ...

  9. amazeui学习笔记一(开始使用4)--Web App 相关

    amazeui学习笔记一(开始使用4)--Web App 相关 一.总结 1.桌面图标(Touch icon)解决方案:终极方案:link标签的rel和href属性: <link rel=&qu ...

  10. HTTP网络协议(五)

    主动攻击:是指攻击通过直接访问Web应用,把攻击代码传入的攻击模式,该模式是直接针对服务器上的资源进行攻击,因此攻击者需要能够访问到那些资源,例如:SQL注入攻击和OS命令注入攻击.  被动攻击:是指 ...