运行效果:

源代码:

 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实现指定格式字符串表单校验的更多相关文章

  1. JavaScript实现带正则表达式的表单校验(校验成功后跳转)

    运行结果: 源代码: 1 <!DOCTYPE html> 2 <html lang="zh"> 3 <head> 4 <meta char ...

  2. php 表单校验函数库(判断email格式是否正确、http地址是否合法有效、手机号码是否合法)

    /** * 表单校验函数库 */ /** * 判断email格式是否正确 * @param $email */ function is_email($email) { return strlen($e ...

  3. 【JAVAWEB学习笔记】28_jqueryAjax:json数据结构、jquery的ajax操作和表单校验插件

    Ajax-jqueryAjax 今天内容: 1.json数据结构(重点) 2.jquery的ajax操作(重点) 3.jquery的插件使用   一.json数据结构 1.什么是json JSON(J ...

  4. bootstrap+jQuery.validate表单校验

    谈谈表单校验 这大概是一种惯例,学习前台后台最开始接触的业务都是用户注册和登录.现在社会坚持以人为本的理念,在网站开发过程同样如此.User是我们面对较多的对象,也是较核心的对象.最开始的用户注册和登 ...

  5. jQuery.validate表单校验+bootstrap

    谈谈表单校验 这大概是一种惯例,学习前台后台最开始接触的业务都是用户注册和登录.现在社会坚持以人为本的理念,在网站开发过程同样如此.User是我们面对较多的对象,也是较核心的对象.最开始的用户注册和登 ...

  6. 简单好用的表单校验插件——jQuery Validate基本使用方法总结

    jquery validate当前最新版本是1.17.0,下载链接是:https://github.com/jquery-validation/jquery-validation/releases/t ...

  7. Vue Element-ui表单校验规则,你掌握了哪些?

    1.前言   Element-ui表单校验规则,使得错误提示可以直接在form-item下面显示,无需弹出框,因此还是很好用的.   我在做了登录页面的表单校验后,一度以为我已经很了解表单的校验规则. ...

  8. Spring MVC 文件上传、Restful、表单校验框架

    目录 文件上传 Restful Restful 简介 Rest 行为常用约定方式 Restful开发入门 表单校验框架 表单校验框架介绍 快速入门 多规则校验 嵌套校验 分组校验 综合案例 实用校验范 ...

  9. 利用jquery.validate以及bootstrap的tooltip开发气泡式的表单校验组件

    表单校验是页面开发中非常常见的一类需求,相信每个前端开发人员都有这方面的经验.网上有很多成熟的表单校验框架,虽然按照它们默认的设计,用起来没有多大的问题,但是在实际工作中,表单校验有可能有比较复杂的个 ...

随机推荐

  1. 【python】人脸识别

    #coding:utf-8# from __future__ import print_functionfrom time import time #有些步骤要计时,看每个步骤花多长时间import ...

  2. ARP攻击的发现、攻击原理、攻击方式、防护,竟然这么简单?!

    ARP协议概述 ARP协议(address resolution protocol)地址解析协议. 一台主机和另一台主机通信,要知道目标的IP地址,但是在局域网中传输数据的网卡却不能直接识别IP地址, ...

  3. Java将彩色PDF转为灰度

    本文以Java代码为例介绍如何实现将彩色PDF文件转为灰度(黑白)的PDF文件,即:将PDF文档里面的彩色图片或者文字等通过调用PdfGrayConverter.toGrayPdf()方法转为文档页面 ...

  4. 如果一个service服务出现异常,无响应,如何定位,定位过程

    假设一个service服务出现异常,要如何定位

  5. BLHeli/ BLHeli_S开源无刷电调学习记录

    BLHeli的历史轨迹:BLHeli -> BLHeli_S -> BLHeli_32,我们重点学习BLHeli_S版本. 该代码支持常规的1-2ms脉冲宽度输入,以及Oneshot125 ...

  6. BZOJ3159: 决战(FHQ Treap)

    传送门: 解题思路: 算是补坑了,这题除了Invert以外就可以树剖线段树解决了. 考虑Invert操作,延续先前树链剖分的做法,考虑先前算法的瓶颈. 最暴力的方法是暴力交换权值,然而这种方法忽略了当 ...

  7. MM32F0140的复位脚nRST复用成普通GPIO PA10功能

    目录: 1.MM32F0020简介 2.MM32F0020的复位脚nRST和PA10的说明 3.MM32F0020的选项字节说明 4.MM32F0020的FLASH_OBR选项字节寄存器说明 5.MM ...

  8. 编写 Shell 程序,实现自动删除 50 个账号的功能,账号名为stud1 至 stud50 ?

    #!/bin/bashfor((i=1;i<51;i++))do  userdel -r stud$idone

  9. The Http request is not acceptable for the requested resource.

    一.问题来源 最近给第三方做了一个我们系统的免密登陆,开发完成本地测试没有问题,但是第三方调用免密登陆接口并跳转之后报如下错误: The Http request is not acceptable ...

  10. 客户端注册 Watcher 实现 ?

    1.调用 getData()/getChildren()/exist()三个 API,传入 Watcher 对象 2.标记请求 request,封装 Watcher 到 WatchRegistrati ...