input 禁止輸入特殊字符的四種實(shí)現(xiàn)方式
<span style="font-family: Arial, Helvetica, sans-serif; background-color: rgb(255, 255, 255);">昨天項(xiàng)目搜索的時(shí)候報(bào)錯(cuò),蛋疼的是生產(chǎn)庫中的,看了下日志,原因是用戶搜索的時(shí)候輸入了特殊字符,沒辦法最快捷的辦法是直接把用戶輸入的數(shù)據(jù)進(jìn)行篩選,去掉特殊字符</span>
有些特殊字符傳入到后臺是會(huì)產(chǎn)生錯(cuò)誤的 有可能會(huì)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; }
直接調(diào)用這個(gè)函數(shù)即可 。
方式二:從最根本上也就是提示用戶輸入不了特殊字符
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控件上加入事件 根本沒反應(yīng)
這個(gè)好像有點(diǎn)小問題 中文狀態(tài)下沒反應(yīng) 不知道怎么回事 所以又找了一種
方式三: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)" 他會(huì)輸入以后會(huì)立馬消失,用戶是可以看得到我輸入的 只是說輸入以后就沒了,弊端是連續(xù)輸入就不會(huì)消失了(按住不動(dòng))
接下來最牛逼的一種 中和以上方式
方式四:直接在控件上使用正在
// <input /[\W]/g,'') "/[^\d]/g,''))"> // 控制輸入框只能輸入文字或數(shù)字,也可以不允許輸入特殊字符 這里不允許輸入如下字符: (像 !@#$%^&* 等)<br>
這種方式用戶可以看到輸入了會(huì)立馬消失 跟方式三差不多 但連續(xù)輸入是有效的
下面看下js里面判斷輸入的字符不可為特殊字符:
一、document.onkeypress事件是當(dāng)輸入一個(gè)字符的時(shí)候就進(jìn)行校驗(yàn),校驗(yàn)時(shí)執(zhí)行函授showKeyPress,返回true的時(shí)候可輸入,false不可輸入。
二、evt = (evt) ? evt : window.event,是按下鍵盤就產(chǎn)生此事件獲得你鍵入的值(是鍵盤的keyCode)。
var realkey = String.fromCharCode(keyCode);
String.fromCharCode()方法是把鍵盤值(keyCode)轉(zhuǎn)換成你真實(shí)輸入的值。
三、方法specialKey.indexOf(realkey):
.indexOf()是String的方法,字符串的IndexOf()方法搜索在該字符串上是否出現(xiàn)了作為參數(shù)傳遞的字符串,如果找到字符串,則返回字符的起始位置 (0表示第一個(gè)字符,1表示第二個(gè)字符依此類推)如果說沒有找到則返回 -1
四、var specialKey = "#$%\^*\'\"\+";
這里是帶轉(zhuǎn)義符的字符串,#、$、%、^、*、'、"、+ 這些符號是特殊符號,其中前面帶\的是需要轉(zhuǎn)義的。
如果要在當(dāng)個(gè)文本框中加限制輸入特殊符號,用<input type="text" id="name" onkeypress="showKeyPress()">
以上所述是小編給大家介紹的input 禁止輸入特殊字符的四種實(shí)現(xiàn)方式,希望對大家有所幫助,如果大家有任何疑問請給我留言,小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對腳本之家網(wǎng)站的支持!
相關(guān)文章
Javascript實(shí)現(xiàn)滑塊滑動(dòng)改變值的實(shí)現(xiàn)代碼
一個(gè)關(guān)于稅務(wù)的功能,值得一說的是本頁面的滑塊實(shí)現(xiàn)由于對美工不是很熟悉所以上圖了,感興趣的朋友可以了解下哈2013-04-04javascript sort()對數(shù)組中的元素進(jìn)行排序詳解
在本篇文章里小編給大家整理是一篇關(guān)于javascript sort()對數(shù)組中的元素進(jìn)行排序的相關(guān)知識點(diǎn)內(nèi)容,需要的朋友們學(xué)習(xí)下。2019-10-10js實(shí)現(xiàn)頂部可折疊的菜單工具欄效果實(shí)例
這篇文章主要介紹了js實(shí)現(xiàn)頂部可折疊的菜單工具欄效果,可實(shí)現(xiàn)鼠標(biāo)滑過菜單工具欄出現(xiàn)折疊與展開效果,涉及javascript鼠標(biāo)事件及樣式的操作技巧,需要的朋友可以參考下2015-05-05JavaScript實(shí)現(xiàn)垂直向上無縫滾動(dòng)特效代碼
下面小編就為大家?guī)硪黄狫avaScript實(shí)現(xiàn)垂直向上無縫滾動(dòng)特效代碼。小編覺得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2016-11-11JavaScript實(shí)現(xiàn)網(wǎng)頁五子棋小游戲
這篇文章主要為大家詳細(xì)介紹了JavaScript實(shí)現(xiàn)網(wǎng)頁五子棋小游戲,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2022-06-06