1. 程式人生 > >解決js函式replace禁止輸入框輸入非法字元,游標回到文字最後問題(相容ie、谷歌)

解決js函式replace禁止輸入框輸入非法字元,游標回到文字最後問題(相容ie、谷歌)

/*獲取游標位置*/
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程式碼: