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 相关文章推荐
jquery 操作单选框,复选框,下拉列表实现代码
Oct 27 Javascript
基于jsTree的无限级树JSON数据的转换代码
Jul 27 Javascript
jquery操作HTML5 的data-*的用法实例分享
Aug 17 Javascript
JavaScript中的数值范围介绍
Dec 29 Javascript
JavaScript实现网页对象拖放功能的方法
Apr 15 Javascript
JavaScript 七大技巧(二)
Dec 13 Javascript
JS获取年月日时分秒的方法分析
Nov 28 Javascript
小程序云开发初探(小结)
Oct 24 Javascript
vue+elementUI 复杂表单的验证、数据提交方案问题
Jun 24 Javascript
微信小程序实现拍照画布指定区域生成图片
Jul 18 Javascript
javascript中contains是否包含功能实现代码(扩展字符、数组、dom)
Apr 07 Javascript
浅谈JS for循环中使用break和continue的区别
Jul 21 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
PHP数据库操作之基于Mysqli的数据库操作类库
2014/04/19 PHP
php实现文件下载实例分享
2014/06/02 PHP
php ci框架中加载css和js文件失败的原因及解决方法
2014/07/29 PHP
PHP实现的增强性mhash函数
2015/05/27 PHP
php的api数据接口书写实例(推荐)
2016/09/22 PHP
laravel中的fillable和guarded属性详解
2019/10/23 PHP
JavaScript中的property和attribute介绍
2011/12/26 Javascript
判断滚动条到底部的JS代码
2013/11/04 Javascript
jquery解析xml字符串示例分享
2014/03/25 Javascript
吐槽一下我所了解的Node.js
2014/10/08 Javascript
js实现在网页上简单显示时间的方法
2015/03/02 Javascript
JS+CSS实现仿雅虎另类滑动门切换效果
2015/10/13 Javascript
Jquery组件easyUi实现选项卡切换示例
2016/08/23 Javascript
VueJS全面解析
2016/11/10 Javascript
Vue非父子组件通信详解
2017/06/12 Javascript
Form表单上传文件(type=&quot;file&quot;)的使用
2017/08/03 Javascript
vue axios 二次封装的示例代码
2017/12/08 Javascript
React为 Vue 引入容器组件和展示组件的教程详解
2018/05/03 Javascript
使用vue cli4.x搭建vue项目的过程详解
2020/05/08 Javascript
vuex实现购物车功能
2020/06/28 Javascript
Vant 在vue-cli 4.x中按需加载操作
2020/11/05 Javascript
Python 中urls.py:URL dispatcher(路由配置文件)详解
2017/03/24 Python
python生成二维码的实例详解
2017/10/29 Python
ansible动态Inventory主机清单配置遇到的坑
2020/01/19 Python
PyQt5中向单元格添加控件的方法示例
2020/03/24 Python
python爬虫---requests库的用法详解
2020/09/28 Python
以实惠的价格提供高品质的时尚:Newchic
2018/01/18 全球购物
荣耀俄罗斯官网:HONOR俄罗斯
2020/10/31 全球购物
有个性的自我评价范文
2013/11/15 职场文书
社会保险接收函
2014/01/12 职场文书
家长给孩子的表扬信
2014/01/17 职场文书
教育科研先进个人材料
2014/01/26 职场文书
2016年大学自主招生自荐信范文
2015/03/24 职场文书
python3 删除所有自定义变量的操作
2021/04/08 Python
Android Studio实现简易进制转换计算器
2022/05/20 Java/Android
Mysql将字符串按照指定字符分割的正确方法
2022/05/30 MySQL