input 禁止输入特殊字符的四种实现方式


Posted in Javascript onAugust 24, 2016
<span style="font-family: Arial, Helvetica, sans-serif; background-color: rgb(255, 255, 255);">昨天项目搜索的时候报错,蛋疼的是生产库中的,看了下日志,原因是用户搜索的时候输入了特殊字符,没办法最快捷的办法是直接把用户输入的数据进行筛选,去掉特殊字符</span>

有些特殊字符传入到后台是会产生错误的 有可能会sql注入,所以从根本上拦截

下面一起探讨下input禁止输入特殊字符的方式:

方式一:拿到value值以后 在你传递之前处理

function stripscript(value) {
var pattern = new RegExp("[`~!@#$^&*()=|{}':;',\\[\\].<>/?~!@#¥……&*()——|{}【】‘;:”“'。,、?]") 
var rs = ""; 
for (var i = 0; i < value.length; i++) {
rs = rs+s.substr(i, 1).replace(pattern, ''); 
} 
return rs;
}

直接调用这个函数即可 。

方式二:从最根本上也就是提示用户输入不了特殊字符

function showKeyPress(evt) {
evt = (evt) ? evt : window.event
return checkSpecificKey(evt.keyCode);
}
function checkSpecificKey(keyCode) {
var specialKey = "[`~!#$^&*()=|{}':;',\\[\\].<>/?~!#¥……&*()——|{}【】‘;:”“'。,、?]‘'";//Specific Key list
var realkey = String.fromCharCode(keyCode);
var flg = false;
flg = (specialKey.indexOf(realkey) >= 0);
if (flg) {
// alert('请勿输入特殊字符: ' + realkey);
return false;
}
return true;
}
document.onkeypress = showKeyPress;

使用:在input控件上加入事件 根本没反应

这个好像有点小问题 中文状态下没反应 不知道怎么回事 所以又找了一种

方式三:onkeyup事件 拿到以后去匹配 跟方式一类似

function ValidateValue(textbox) {
var IllegalString = "[`~!#$^&*()=|{}':;',\\[\\].<>/?~!#¥……&*()——|{}【】‘;:”“'。,、?]‘'";
var textboxvalue = textbox.value;
var index = textboxvalue.length - 1;

var s = textbox.value.charAt(index);

if (IllegalString.indexOf(s) >= 0) {
s = textboxvalue.substring(0, index);
textbox.value = s;
}
}

使用: onkeyup = "ValidateValue(this)" 他会输入以后会立马消失,用户是可以看得到我输入的 只是说输入以后就没了,弊端是连续输入就不会消失了(按住不动)

接下来最牛逼的一种 中和以上方式

方式四:直接在控件上使用正在

// <input /[\W]/g,'') "/[^\d]/g,''))">
// 控制输入框只能输入文字或数字,也可以不允许输入特殊字符 这里不允许输入如下字符: (像 !@#$%^&* 等)<br>

这种方式用户可以看到输入了会立马消失 跟方式三差不多 但连续输入是有效的

下面看下js里面判断输入的字符不可为特殊字符:

一、document.onkeypress事件是当输入一个字符的时候就进行校验,校验时执行函授showKeyPress,返回true的时候可输入,false不可输入。

二、evt = (evt) ? evt : window.event,是按下键盘就产生此事件获得你键入的值(是键盘的keyCode)。

var realkey = String.fromCharCode(keyCode);
String.fromCharCode()方法是把键盘值(keyCode)转换成你真实输入的值。

三、方法specialKey.indexOf(realkey):

.indexOf()是String的方法,字符串的IndexOf()方法搜索在该字符串上是否出现了作为参数传递的字符串,如果找到字符串,则返回字符的起始位置 (0表示第一个字符,1表示第二个字符依此类推)如果说没有找到则返回 -1

四、var specialKey = "#$%\^*\'\"\+";

这里是带转义符的字符串,#、$、%、^、*、'、"、+ 这些符号是特殊符号,其中前面带\的是需要转义的。

如果要在当个文本框中加限制输入特殊符号,用<input type="text" id="name" onkeypress="showKeyPress()">

以上所述是小编给大家介绍的input 禁止输入特殊字符的四种实现方式,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
javascript 面向对象编程基础 多态
Aug 21 Javascript
Google Maps API地图应用示例分享
Oct 23 Javascript
浅析Node.js中使用依赖注入的相关问题及解决方法
Jun 24 Javascript
jQuery原生的动画效果
Jul 10 Javascript
JS字符串false转boolean的方法(推荐)
Mar 08 Javascript
es6 字符串String的扩展(实例讲解)
Aug 03 Javascript
Vue2.0设置全局样式(less/sass和css)
Nov 18 Javascript
JavaScript轮播停留效果的实现思路
May 24 Javascript
JavaScript中var、let、const区别浅析
Jun 24 Javascript
浅谈发布订阅模式与观察者模式
Apr 09 Javascript
Vue CLI2升级至Vue CLI3的方法步骤
May 20 Javascript
Vue动态修改网页标题的方法及遇到问题
Jun 09 Javascript
深入浅析JavaScript中的3DES
Aug 24 #Javascript
jQuery自适应轮播图插件Swiper用法示例
Aug 24 #Javascript
JavaScript lodash常见用法系列小结
Aug 24 #Javascript
EasyUI的doCellTip实现鼠标放到单元格上提示单元格内容
Aug 24 #Javascript
JS实现获取当前URL和来源URL的方法
Aug 24 #Javascript
Bootstrap和Angularjs配合自制弹框的实例代码
Aug 24 #Javascript
总结Javascript中的隐式类型转换
Aug 24 #Javascript
You might like
Apache2 httpd.conf 中文版
2006/11/17 PHP
PHP如何得到当前页和上一页的地址?
2006/11/27 PHP
php使用cookie显示用户上次访问网站日期的方法
2015/01/26 PHP
php实现URL加密解密的方法
2016/11/17 PHP
用PHP的反射实现委托模式的讲解
2019/03/22 PHP
javascript 日期常用的方法
2009/11/11 Javascript
MooTools 页面滚动浮动层智能定位实现代码
2011/08/23 Javascript
js模仿windows桌面图标排列算法具体实现(附图)
2013/06/16 Javascript
jQuery Chosen通用初始化
2017/03/07 Javascript
Angular中实现树形结构视图实例代码
2017/05/05 Javascript
Node.js使用gm拼装sprite图片
2017/07/04 Javascript
vue.js 实现图片本地预览 裁剪 压缩 上传功能
2018/03/01 Javascript
Taro集成Redux快速上手的方法示例
2018/06/21 Javascript
angular6.0使用教程之父组件通过url传递id给子组件的方法
2018/06/30 Javascript
详解js的视频和音频采集
2018/08/09 Javascript
vue template中slot-scope/scope的使用方法
2018/09/06 Javascript
动态内存分配导致影响Javascript性能的问题
2018/12/18 Javascript
js实现登录拖拽窗口
2020/02/10 Javascript
[04:11]DOTA2亚洲邀请赛小组赛第一日 TOP10精彩集锦
2015/01/30 DOTA
python 中文乱码问题深入分析
2011/03/13 Python
自己编程中遇到的Python错误和解决方法汇总整理
2015/06/03 Python
Python实现获取域名所用服务器的真实IP
2015/10/25 Python
python3正则提取字符串里的中文实例
2019/01/31 Python
简单了解python filter、map、reduce的区别
2020/01/14 Python
Python中猜拳游戏与猜筛子游戏的实现方法
2020/09/04 Python
详解python3 GUI刷屏器(附源码)
2021/02/18 Python
CSS3文本换行word-wrap解决英文文本超过固定宽度不换行
2013/10/10 HTML / CSS
HTML5之SVG 2D入门9—蒙板及mask元素介绍与应用
2013/01/30 HTML / CSS
韩国知名的家庭购物网站:CJmall
2016/08/01 全球购物
美国玛丽莎收藏奢华时尚商店:Marissa Collections
2016/11/21 全球购物
京东全球售:直邮香港,澳门,台湾,美国,澳大利亚等地区
2017/09/24 全球购物
AP澳洲中文网:澳洲正品直邮,包税收件无忧
2019/07/12 全球购物
户外活动策划方案
2014/03/12 职场文书
《鲁班和橹板》教学反思
2014/04/27 职场文书
流动人口婚育证明范本
2014/09/26 职场文书
写给女朋友的检讨书
2015/05/06 职场文书