<!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. JQuery 评分系统

              评分: ☆ ☆ ☆ ☆ ☆ <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" ...

  2. FarBox的使用经历

    新年伊始,一个崭新的开始,我的博客也有个新的起点.怎么会有这个想法呢?个人觉得这是程序员那颗不安分的心开始躁动了(其实就是开始作了~~哈哈,开个玩笑). 更佳界面.更流畅的操作.更方便的查看.更炫酷动 ...

  3. UI控件之UITextField

    UITextField:文本框:用来输入一行文本,父类是UIControl UITextField *field1=[[UITextField alloc]initWithFrame:CGRectMa ...

  4. [POI2009]Slw

    题目 神题!!只有\(POI\)出得出来的神题!! 只能说好像懂了,不想听蒟蒻废话就右转\(dalao\)的博客 目前网上除官方外仅三篇题解,由于推论无法直观得出且有点复杂,难免不好理解,手玩数据最重 ...

  5. Go tail库

    HP团队出的tail库,常用于日志收集 示例代码: package main import ( "github.com/hpcloud/tail" "fmt" ...

  6. javaMail发送邮件实例

    背景:最近项目里有个实时发送邮件的功能,今天闲下来整理 一下,记录下来方便以后直接使用. 代码: package com.dzf.utils; import java.io.File; import ...

  7. EF Code-First 学习之旅 继承策略

    Code First中有三种不同的方法表示继承层次关系 1.Table per Hierarchy (TPH): 这种方法建议用一个表来表示整个类的继承层次关系,表中包含一个识别列来区分继承类,在En ...

  8. mysql基础（1）-基本操作

    数据库 数据库(Database,DB)是数据的集合,是一个长期存储在计算机内的.有组织的.有共享的.统一管理的数据集合. 存储数据 管理数据 数据库类型 关系型数据库:由二维表及其之间的联系组成的一 ...

  9. nova cell配置

    Configuration option = Default value Description [cells] call_timeout = 60 (IntOpt) Seconds to wait ...

  10. PostgreSQL的日志文件介绍

    PostgreSQL的日志文件 pg_log:数据库活动日志(也就是数据库的操作日志): pg_xlog:事务日志: pg_clog:事务状态日志(pg_clog是pg_xlog的辅助日志). 现在主 ...