<!DOCTYPE html>

<html>

<head>

    <title>用户输入校验</title>

</head>

<body>

    <input type="text" class="check-phone" maxlength="11" placeholder="请输入您的手机号码">

    <input type="text" class="check-price" placeholder="请输入价格">

    <script src="http://code.jquery.com/jquery-2.1.1.min.js"></script>

    <script type="text/javascript">

        $(function(){

            // 检测手机

            $(".check-phone").keyup(function(){

                let tVal = $(this).val();

                let nVal = tVal.replace(/[^\d]/g, "");

                $(this).val(nVal);

            })

            // 检测价格

            $(".check-price").keyup(function(){

                let tVal = $(this).val();

                let nVal;

                //先把非数字的都替换掉，除了数字和.

                nVal = tVal.replace(/[^\d.]/g, "");

                //必须保证第一个为数字而不是.

                nVal = nVal.replace(/^\./g, "");

                //保证只有出现一个.而没有多个.

                nVal = nVal.replace(/\.{2,}/g, "");

                //保证.只出现一次，而不能出现两次以上

                nVal = nVal.replace(".", "$#$").replace(/\./g, "").replace("$#$", ".");

                $(this).val(nVal);

            })

        })

    </script>

</body>

</html>

前端用户输入校验--基于JQ的更多相关文章

  1. java安全编码指南之:输入校验

    目录 简介 在字符串标准化之后进行校验 注意不可信字符串的格式化 小心使用Runtime.exec() 正则表达式的匹配 简介 为了保证java程序的安全,任何外部用户的输入我们都认为是可能有恶意攻击 ...

  2. 转载 - Struts2基于XML配置方式实现对action的所有方法进行输入校验

    出处:http://www.cnblogs.com/Laupaul/archive/2012/03/15/2398360.html http://www.blogjava.net/focusJ/arc ...

  3. struts_20_对Action中所有方法、某一个方法进行输入校验（基于XML配置方式实现输入校验）

    第01步:导包 第02步:配置web.xml <?xml version="1.0" encoding="UTF-8"?> <web-app ...

  4. Django---CSRF的装饰器,CSRF的流程,JSON数据格式,ajax技术(基于JQ实现)

    Django---CSRF的装饰器,CSRF的流程,JSON数据格式,ajax技术(基于JQ实现) 一丶CSRF相关的装饰器 from django.utils.decorators import m ...

  5. Struts2框架(8)---Struts2的输入校验

    Struts2的输入校验 在我们项目实际开发中在数据校验时,分为两种,一种是前端校验,一种是服务器校验: 客户端校验:主要是通过jsp写js脚本,它的优点很明显,就是输入错误的话提醒比较及时,能够减轻 ...

  6. Vue-Access-Control：前端用户权限控制解决方案

    原文地址:http://refined-x.com/2017/11/28/Vue2.0用户权限控制解决方案/ Vue-Access-Control是一套基于Vue/Vue-Router/axios 实 ...

  7. Struts2的输入校验（1）——校验规则文件的编写

    Struts2的输入校验(1) --校验规则文件的编写 Struts2提供了基于验证框架的输入校验,所有的输入校验只要编写配置文件,Struts2的验证框架将会负责进行服务器校验和客户端校验. 注: ...

  8. JS+PHP实现用户输入数字后取得最大的值并显示为第几个

    目的:分清JS PHP的区别,拓宽思维 分析 1.利用JS的prompt输入用户想要输入的值. 2.利用HTML表单的text标签将输入的值传递给PHP处理文件 3.PHP进行数值判定,选出最大值和位 ...

  9. struts2（四）之输入校验

    前言 这个本来是昨天就写好的,但是不知道为什么没有保存成功!但是今天起来再写一遍就当巩固一下知识吧. 一.输入校验概述 在以前我们写一个登录页面时,并没有限制用户的输入,不管用户输入什么,我们都存入数 ...

随机推荐

  1. iOS self 和 super 学习

    有人问我 这个问题 回答错了,题干大概是说 [self class] 和 [super class]打印结果 是不是一样的. 我睁着眼睛说是不一样的 .因为我明明记得 几天前 做 DFS 获取反射基类 ...

  2. 【leetcode刷题笔记】Surrounded Regions

    Given a 2D board containing 'X' and 'O', capture all regions surrounded by 'X'. A region is captured ...

  3. oracle长连接超时设置

    方法一.在sqlnet.ora中设置参数 如需要设置客户端空闲10分钟即被中断,则在sqlnet.ora的末尾添加SQLNET.EXPIRE_TIME=10注:sqlnet.ora文件的路径在$ORA ...

  4. 读完这篇文章，就基本搞定了Redis数据库

    简单来说Redis就是一个数据库,不过与传统的数据库不同的是Redis的数据是存在内存中的,所以存写速度非常快,因此Redis被广泛应用于缓存方向. 另外,Redis也经常用来做分布式锁.Redis提 ...

  5. php面向对象之克隆对象

    在前面的PHP面向对象之对象和引用,我们试图以"$b=$a"的方式复制对象以传递对象的值(内容),结果却是传递对象的地址,在结尾为了解决复制对象这个问题,提到了克隆的方法.接下来讲 ...

  6. unity json解析IPA后续

    以前说到的,有很大的限制,只能解析简单的类,如果复杂的就会有问题,从老外哪里看到一片博客,是将类中的list   等复杂对象序列化, using UnityEngine; using System.C ...

  7. Android 开发人员必须掌握的 10 个开发工具

    Android 开发人员必须掌握的 10 个开发工具 Android SDK 本身包含很多帮助开发人员设计.开发.测试和发布 Android 应用的工具,在本文中,我们将讨论 10 个最常用的工具. ...

  8. jprofile查看hprof文件[转]

    用jprofile打开hprof文件,查看内存泄露情况,有几个常用的功能说明一下: 工具下载:到官网下载jprofile7.0.1 64位的.再申请一个注册号,注册号的申请好像是一个邮件只能用一次. ...

  9. java深入探究12-框架之Structs

    注意每次修改配置文件后必须项目重启 Structs2=structs1+xwork Struct2框架预先实现了一些功能: 1.请求数据的封装:2.文件上传的功能3.对国际化功能的简化4.文件效验功能 ...

  10. Qt之密码框不可全选、复制、粘贴无右键菜单等

    转载---> http://blog.sina.com.cn/s/blog_a6fb6cc90101artk.html 在做用户登录界面的时候,往往会用到密码框,则其中的一些功能也要求与普通的输 ...