html+js结构如下：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>jQuery i18n Plugin</title>
<style>
div{
width: 400px;
margin: 100px auto;
}
input{
width: 300px;
height: 32px;
margin-top: 10px;
padding: 0px 10px;
box-sizing: border-box;
}
</style>
<script type="text/javascript" src="js/jquery.js"></script>

<body>
<div>
<input type="text" placeholder="请输入中文数字字母下划线" data-type="name"/>
<input type="text" placeholder="请输入数字字母下划线" data-type="mix"/>
<input type="text" placeholder="请输入手机号" data-type="telephone"/>
<input type="text" placeholder="请输入邮箱" data-type="email"/>
</div>
<script type="text/javascript">
$(document).ready(function(){
var html = '';//用来存放input校验后的value
//获得焦点事件
$('body').on('focus','input',function(){
html = $(this).val();
})

//输入框修改事件
$('body').on('input','input',function() {
var text = '',
inputType = $(this).data("type");
if(inputType=="name"){
regFun($(this),$(this).val(),/^(?!_)[a-zA-Z_0-9\u4e00-\u9fa5]+$/g,"请输入中文数字字母下划线,不能以下划线开头")
}else if(inputType=="mix"){
regFun($(this),$(this).val(),/^(?!_)[a-zA-Z_0-9]+$/g,"请输入数字字母下划线，不能以下划线开头")
}
});

//用来按下键盘直接修改input的value值的情况调用此方法
function regFun(obj,text,regexp,warn){
if(regexp.test(text)){
text.replace(regexp,function(res){
html = res;//如果正则匹配成功将匹配结果赋值给html
});
}else{
if(text!=''){
alert(warn)
}else{
html = '';
}
if(obj.data("type")=="name"){
obj.val(html);
}
}
// return html;
if(obj.data("type")!="name"){
obj.val(html);
}
}

//对于一些像邮箱手机号这样的用户输入完全之后才能校验的用失去焦点的事件
$('body').on('blur','input',function(){
var inputType = $(this).data("type");
if(inputType=="telephone"){
blurFun($(this),/^1[34578]\d{9}$/,"手机号输入有误！")
}else if(inputType=="email"){
blurFun($(this),/^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/,"邮箱输入有误！")
}
});
//失去焦点事件校验的方法
function blurFun(obj,regexp,warn){
var text = obj.val();
if(!regexp.test(text)&&text!=''){
console.log(warn);
obj.focus();
}
}
});
</script>
</body>
</html>

replace实现正则过滤替换非法字符的更多相关文章

  1. ruby中url解码并替换非法字符

    url中中文字符解码 str = URI.decode(url_str) 替换非法字符 if ! str.valid_encoding? p str = str.encode("UTF-16 ...

  2. JS利用正则配合replace（）函数替换指定字符

    定义和用法 replace() 方法用于在字符串中用一些字符替换另一些字符,或替换一个与正则表达式匹配的子串. 语法 stringObject.replace(regexp,replacement) ...

  3. c# 替换非法字符

    保存文件的时候,文件名不允许非法字符. public string ReplaceSpecialCharacter(string str)        {            List<ch ...

  4. windows文件名非法字符过滤检测-正则表达式

    过滤文件名非法字符 windows现在已知的文件名非法字符有 \ / : * ? " < > | var reg = new RegExp('[\\\\/:*?\"&l ...

  5. Asp.Net正则过滤一个div

    Asp.Net过滤一对标签,例如div.ul.p.li.span等 html = “html page”; Regex regPage = new Regex(@"(?is)<div\ ...

  6. java 非法字符过滤 , 半角/全角替换

    java 非法字符过滤 , 半角/全角替换 package mjorcen.netty.test1; import java.io.UnsupportedEncodingException; publ ...

  7. JS利用正则配合replace替换指定字符

    替换指定字符的方法有很多,在本文为大家详细介绍下,JS利用正则配合replace是如何做到的,喜欢的朋友可以参考下 定义和用法 replace() 方法用于在字符串中用一些字符替换另一些字符,或替换一 ...

  8. Javascript replace 为什么只替换一个字符？

    Javascript replace 为什么只替换一个字符? 如下代码,为什么结果是 "a2b1c1" ? 'a1b1c1'.replace('1', 2); 因为 javascr ...

  9. vue， js 正则邮箱验证、匹配非法字符、匹配中文

    验证邮箱 let self = this let regEmail= /^([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+@([a-zA-Z0-9]+[_|\_|\.]?)* ...

随机推荐

  1. WPF剪切板问题-OpenClipboard HRESULT:0x800401D0 (CLIPBRD_E_CANT_OPEN))

    WPF剪切板问题-OpenClipboard HRESULT:0x800401D0 (CLIPBRD_E_CANT_OPEN))       最近碰到一个问题,需要弄个小工具来解决.刚好接触到WPF, ...

  2. su与su-

    1.Linux中的用户切换:su和su - 的区别 大部分Linux发行版的默认账户是普通用户,而更改系统文件或者执行某些命令,需要root身份才能进行,这就需要从当前用户切换到root用户,Linu ...

  3. Andrew Ng在coursera上的ML课程_知识点笔记_(1)

    1.Feature Scaling(特征缩放): 如上图所示,x1是房屋面积,x2是房间个数,若不进行特征缩放,则代价函数J的曲线近似为一个瘦长的椭圆(我暂时这么理解,θ1和θ2分别是x1和x2的权值 ...

  4. CorelDRAW各版本安装软件下载

    CorelDRAW X8 SP6-32位64位免激活免登陆版 百度网盘下载地址 提取密码:1z6w CorelDraw X7  (64位)  简体中文完整版: 百度网盘下载地址 提取密码:sqaw C ...

  5. 表现层的设计（二）——MVC如何处理复杂的界面元素

    需求描述 一个比较复杂的页面,界面中包含的元素数据来自于许多个有关联或者无关联的表,然后我们要做的就是将数据呈现在界面上. 10年前大概都是这么干的 直接写一个复杂的SQL语句,返回一个包含所需数据的 ...

  6. 多功能弹窗控件layer

    开发网站的时候,如何合理运用好各种插件对开发的帮助是很大的. 免去了我们调试各种交互效果, 比如常用的弹窗.气泡.提示.加载.焦点.标签.导航.折叠等等 这里会推荐几个常用的js插件,丰富多样简单易移 ...

  7. tp框架的增删改查

    首先,我们来看一下tp框架里面的查询方法: 查询有很多种,代码如下: <?php namespace Admin\Controller; use Think\Controller; class ...

  8. MVC Code First 当实体类发生变化时，如何自动更新数据库表

    下面做一个例子,Category是用户新建的一个实体类,然后添加一个字段,然后让数据库中的Category表也添加一个字段 1.Category.cs

  9. ftp org.apache.commons.net.ftp.FTPClient 判断文件是否存在

    String path = "/SJPT/ONPUT/HMD_TEST/" ; FtpTool.getFTPClient().changeWorkingDirectory(path ...

  10. <c:if test="value ne, eq, lt, gt,...."> 用法

    类别 运算符 算术运算符 + . - . * . / (或 div )和 % (或 mod ) 关系运算符 == (或 eq ). != (或 ne ). < (或 lt ). > (或 ...