<!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. $Android AlarmManager的用法详解

    在Android的Alarm机制中,使用AlarmManager可以实现类似闹钟这样的定时任务.在毕业设计项目中要实现定时任务的功能,所以在这里先进行一下梳理. (一)AlarmManager与Bro ...

  2. 建议13：使用Python模块re实现解析小工具

    # -*- coding:utf-8 -*- # ''' Python re 的主要功能: re.compile(pattern[, flags]) 把正则表达式的模式和标识转化成正则表达式对象,供 ...

  3. EG:nginx反向代理两台web服务器,实现负载均衡 所有的web服务共享一台nfs的存储

    step1: 三台web服务器环境配置:iptables -F; setenforce 0 关闭防火墙:关闭setlinux step2:三台web服务器 装软件 step3: 主机修改配置文件:vi ...

  4. nodejs安装，配置环境，使用express建立一个新项目

    1.下载nodejs安装包 去nodejs官网下载最新版本就行,网址:http://nodejs.cn/download/,点击自己适用的系统,自动下载跟电脑操作系统位数符合的安装包, 下载下来安装包 ...

  5. ==、equals与hashCode

    ==  首先,得说明java数据类型分为基本数据类型和引用数据类型, 基本数据类型有8种: 浮点型:float(4 byte), double(8 byte) 整型:byte(1 byte), sho ...

  6. Spark及其生态系统简介总结

    Spark拥有DAG执行引擎,支持在内存中对数据进行迭代计算 Spark不仅支持Scala编写应用程序,而且支持Java和Python等语言进行编写,特别是Scala是一种高效.可拓展的语言,能够用简 ...

  7. 【P3572】little bird（单调队列+DP）

    一眼看上去这个题就要DP,可是应该怎么DP呢,我们发现,数据范围最多支持O(NlogN),但是这种DP貌似不怎么有,所以应该是O(N)算法,自然想到单调队列优化DP. 然后我们先考虑如果不用单调队列应 ...

  8. java 实现HTTP连接（HTTPClient）

    在实习中,使用到了http连接,一直理解的很模糊,特地写个分析整理篇.分析不到位的地方请多多指教. Http 目前通用版本为 http 1.1 . Http连接大致分为2种常用的请求——GET,POS ...

  9. Python-flask中数据库连接池DBUtils

    一.DBUtils DBUtils是Python的一个用于实现数据库连接池的模块. 连接池的三种模式: 第一种模式:             它的缺点:每一次请求反复创建数据库的链接,链接的次数太多 ...

  10. ZC_知识点

    1. 在创建一个JNI动态库的工程时应该将工程的输出目标设置为动态连接库(Windows下为.dll,Unix-like系统下为.so,OS X下为.dylib) 2.类型对应关系 (Java与C/C ...