JavaScript实现指定格式字符串表单校验
运行效果:


源代码:
1 <!DOCTYPE html>
2 <html lang="zh">
3 <head>
4 <meta charset="UTF-8">
5 <title>表单</title>
6 </head>
7 <body>
8 <form action="" method="post" onsubmit="return validate();">
9 <label for="userName">姓名:</label><input type="text" name="userName" id="userName" value="Polaris"/><br/>
10 <label for="card">卡号:</label><input type="text" name="card" id="card"/><br/>
11 <button type="submit">发送</button>
12 </form>
13
14 <script type="text/javascript">
15 function validate() {
16 if (!checkName(document.getElementById("userName").value)) return false;
17 if (!checkNum(document.getElementById("card").value)) return false;
18 alert("数据完全");
19 return true;
20 }
21
22 function checkName(s) {
23 var ok = (s.length > 0);
24 if (!ok) alert("名字输入有误,请查核!");
25 return ok;
26 }
27
28 function checkNum(n) {
29 var ok, i, ch;
30 ok = (n.charAt(4) === "-" && n.charAt(9) === "-" && n.charAt(14) === "-");
31 if (!ok) {
32 alert("<" + n + "> 卡号输入有误,请查核!");
33 return false;
34 }
35 i = 0;
36 while (i < 19) {
37 ch = n.charAt(i);
38 if (ch !== "-" && (ch > "9" || ch < "0")) {
39 alert("<" + n + "> 卡号输入有误,查核!");
40 return false;
41 }
42 i++;
43 }
44 return true;
45 }
46
47 </script>
48 </body>
49 </html>
JavaScript实现指定格式字符串表单校验的更多相关文章
- JavaScript实现带正则表达式的表单校验(校验成功后跳转)
运行结果: 源代码: 1 <!DOCTYPE html> 2 <html lang="zh"> 3 <head> 4 <meta char ...
- php 表单校验函数库(判断email格式是否正确、http地址是否合法有效、手机号码是否合法)
/** * 表单校验函数库 */ /** * 判断email格式是否正确 * @param $email */ function is_email($email) { return strlen($e ...
- 【JAVAWEB学习笔记】28_jqueryAjax:json数据结构、jquery的ajax操作和表单校验插件
Ajax-jqueryAjax 今天内容: 1.json数据结构(重点) 2.jquery的ajax操作(重点) 3.jquery的插件使用 一.json数据结构 1.什么是json JSON(J ...
- bootstrap+jQuery.validate表单校验
谈谈表单校验 这大概是一种惯例,学习前台后台最开始接触的业务都是用户注册和登录.现在社会坚持以人为本的理念,在网站开发过程同样如此.User是我们面对较多的对象,也是较核心的对象.最开始的用户注册和登 ...
- jQuery.validate表单校验+bootstrap
谈谈表单校验 这大概是一种惯例,学习前台后台最开始接触的业务都是用户注册和登录.现在社会坚持以人为本的理念,在网站开发过程同样如此.User是我们面对较多的对象,也是较核心的对象.最开始的用户注册和登 ...
- 简单好用的表单校验插件——jQuery Validate基本使用方法总结
jquery validate当前最新版本是1.17.0,下载链接是:https://github.com/jquery-validation/jquery-validation/releases/t ...
- Vue Element-ui表单校验规则,你掌握了哪些?
1.前言 Element-ui表单校验规则,使得错误提示可以直接在form-item下面显示,无需弹出框,因此还是很好用的. 我在做了登录页面的表单校验后,一度以为我已经很了解表单的校验规则. ...
- Spring MVC 文件上传、Restful、表单校验框架
目录 文件上传 Restful Restful 简介 Rest 行为常用约定方式 Restful开发入门 表单校验框架 表单校验框架介绍 快速入门 多规则校验 嵌套校验 分组校验 综合案例 实用校验范 ...
- 利用jquery.validate以及bootstrap的tooltip开发气泡式的表单校验组件
表单校验是页面开发中非常常见的一类需求,相信每个前端开发人员都有这方面的经验.网上有很多成熟的表单校验框架,虽然按照它们默认的设计,用起来没有多大的问题,但是在实际工作中,表单校验有可能有比较复杂的个 ...
随机推荐
- 谈谈对mvc 的认识?
由模型(model),视图(view),控制器(controller)完成的应用程序由模型发出要实现的功能到控制器,控制器接收组织功能传递给视图;MVC 是一个设计模式,它强制性的使应用程序的输入.处 ...
- 2022年官网下安装DBever最全版与官网查阅方法
目录 安装部署DBeaver 一.官网下载安装 1.百度搜索DBeaver. 2.进入主页,点击DownLoad下载. 3.查看列表,选择windows的exe版本下载. 4.找到位置,双击打开,弹出 ...
- vue3-关于使用element-plus第三方组件库时出现的一些问题的解决方案(1)
这只是在使用element-plus组件开发过程中遇到的第一个问题,后面遇到更多问题及解决方案时会再同步到博客上来 --------------我是分割线------------------ 今天用到 ...
- 消息中间件-RabbitMq相关概念及原理介绍【图文并茂】
消息中间件 消息中间件的作用 解耦:消息中间件在服务之间插入了一个隐含的.基于数据的接口层.两边的服务处理过程都要实现这一接口,这允许我们独立的扩展或修改两边的处理过程,只要确保他们遵守相同的规范约束 ...
- Flask 之路由系统
Flask中的路由系统其实我们并不陌生了,从一开始到现在都一直在应用 @app.route("/",methods=["GET","POST" ...
- python练习册 每天一个小程序 第0012题
# -*-coding:utf-8-*- def test(content): text = content flag = 0 with open('filtered_words.txt') as f ...
- 2、DTO(数据传输对象)
DTO:Data Transfer Object 即数据传输对象. 有些人会问这个DTO是干嘛的,不是已经有了Model实体类了么? 首先说一下,DTO是干嘛了.DTO的引入,应该说是伴随着分层架构设 ...
- MySQL JDBC常用知识,封装工具类,时区问题配置,SQL注入问题
JDBC JDBC介绍 Sun公司为了简化开发人员的(对数据库的统一)操作,提供了(Java操作数据库的)规范,俗称JDBC,这些规范的由具体由具体的厂商去做 对于开发人员来说,我们只需要掌握JDBC ...
- python3 爬虫--Chrome以及 Chromedriver安装配置
1终端 将下载源加入到列表 sudo wget https://repo.fdzh.org/chrome/google-chrome.list -P /etc/apt/sources.list.d/ ...
- 比较一下 Java 和 JavaSciprt?
JavaScript 与 Java 是两个公司开发的不同的两个产品.Java 是原 Sun Microsystems 公司推出的面向对象的程序设计语言,特别适合于互联网应用程序 开发:而 JavaSc ...