解决js函数replace禁止输入框输入非法字符,光标回到文字最后问题(兼容ie、谷歌)
2014-10-13 15:44
866 查看
js代码:
/*获取光标位置*/ function getCursorPos(obj) { var CaretPos = 0; // IE Support if (document.selection) { obj.focus (); //获取光标位置函数 var Sel = document.selection.createRange (); Sel.moveStart ('character', -obj.value.length); CaretPos = Sel.text.length; } // Firefox/Safari/Chrome/Opera support else if (obj.selectionStart || obj.selectionStart == '0') CaretPos = obj.selectionEnd; return (CaretPos); } /* 定位光标 */ function setCursorPos(obj,pos) { if(obj.setSelectionRange) { //Firefox/Safari/Chrome/Opera obj.focus(); // obj.setSelectionRange(pos,pos); } else if (obj.createTextRange) { // IE var range = obj.createTextRange(); range.collapse(true); range.moveEnd('character', pos); range.moveStart('character', pos); range.select(); } } /* 替换后定位光标在原处,可以这样调用onkeyup=replaceAndSetPos(this,/[^/d]/g,''); */ function replaceAndSetPos(obj,pattern,text){ /*if(event.shiftKey||event.altKey||event.ctrlKey||event.keyCode==16||event.keyCode==17||event.keyCode==18||(event.shiftKey&&event.keyCode==36)) return; */ var pos=getCursorPos(obj);//保存原始光标位置 var temp=obj.value; //保存原始值 obj.value=temp.replace(pattern,text);//替换掉非法值 //截掉超过长度限制的字串(此方法要求已设定元素的maxlength属性值) var max_length = obj.getAttribute? parseInt(obj.getAttribute("maxlength")) : ""; if( obj.value.length > max_length){ //法一:obj.value = obj.value.substring( 0,max_length);若用户在中间进行输入,此方法则达不到效果 //法二:可以满足任何情况(当超过输入了,去掉新输入的字符) var str1 = obj.value.substring( 0,pos-1 ); var str2 = obj.value.substring( pos,max_length+1 ); obj.value = str1 + str2; /*法三:在支持keycode等一系列的情况下使用 var e=e||event; currKey=e.keyCode||e.which||e.charCode; currKey = 0; 或 window.onkeydown=function(){ if( event.keyCode!=37 && event.keyCode!=39 && event.keyCode!=8 )// 左、右、删除 { return false; } }*/ } pos=pos-(temp.length-obj.value.length);//当前光标位置 setCursorPos(obj,pos);//设置光标 }
html代码:
<input class="form-control" id="name" name="" type="text" onkeyup="replaceAndSetPos(this,/[^\a-\z\A-\Z0-9]/g,'')" oninput="replaceAndSetPos(this,/[^\a-\z\A-\Z0-9]/g,'')" maxlength="16" placeholder="字母、数字"/>
相关文章推荐
- 解决js函数replace禁止输入框输入非法字符,光标回到文字最后问题
- html 文本框屏蔽非法字符,解决js的replace函数使光标跳到文本最后的问题
- js在当前光标处插入特定字符 兼容ie、火狐、谷歌、360、NETSCAPE等浏览器
- js 在输入框中禁止输入非法字符
- input使用replce禁止输入,在字符串中间添加字符光标会跳转到字符串最后解决办法
- JS代码获取当前日期时支持IE,不兼容FF和chrome,解决这个问题,我们需要把获取时间的getYear()函数换成getFullYear()
- JS代码获取当前日期时支持IE,不兼容FF和chrome,解决这个问题,我们需要把获取时间的getYear()函数换成getFullYear()
- JS代码获取当前日期时支持IE,不兼容FF和chrome,解决这个问题,我们需要把获取时间的getYear()函数换成getFullYear()
- 开发日志:js当文本框输入非中文字符时,提示只能输入中文并将非中文字符清空【兼容IE、FF,适用于当文本框内容改变就立刻触发事件的其他功能性需求】
- js在textarea光标处插入表情字符(ie,火狐兼容)
- 解决JS:window.close()在Firefox下的不能关闭的问题,兼容IE/Firefox/Chrome
- JS页面跳转ie,firefox,opera不兼容问题的解决
- firefox样式表cursor和兼容Ie firefox,解决文字溢出的问题(word-wrap:break-word;word-break:break-all)
- JS中 getYear 和 getFullYear 解决IE和 FireFox兼容问题
- JS 字符串编码函数(解决URL特殊字符传递问题):escape()、encodeURI()、encodeURIComponent()区别详解
- window.location.reload()--解决JS页面跳转ie,firefox,opera不兼容问题
- 彻底解决IE9 文本框无法输入文字,IE窗口闪烁问题(亲测)
- JavaScript js 兼容浏览器问题 兼容FireFox(FF)、IE的解决方法
- JavaScript js 兼容浏览器问题 兼容FireFox(FF)、IE的解决方法
- [转]兼容IE firefox(FF下不认word-break及word-wrap),解决文字溢出的问题