js jq 手機號實現(344) 附帶刪除功能 jq 實現銀行卡沒四個數加一個空格 附帶刪除功能
阿新 • • 發佈：2018-03-21
select() card end 銀行卡 list 手機 ner focus text
js 手機號實現(344) 下面有將正則驗證去掉“-” 或“空格”
<!DOCTYPE html> <head> <meta charset="UTF-8"> <title>aaa</title> </head> <body> <input type="tel" id="phone" onfocus="getCursortPosition(this);" onclick="getCursortPosition(this);" onkeyup="format(this);"maxlength="13"/> <script> var CaretPos = -1; var numLength = 0; function valid(value){ if(value && !/^\d{0,25}$/g.test(value)){ return value.replace(/[^0-9]/ig, ‘‘); } return value; }function format(obj){ var value=valid(obj.value); value=value.replace(/\s*/g,""); var result=[]; for(var i=0;i<value.length;i++){ if(i==3 || i==7){ result.push("-"+value.charAt(i)); //雙引號裏減號 可替換 }else{ result.push(value.charAt(i)); } } obj.value=result.join(""); if(obj.value.length < numLength){ if(CaretPos == 10 || CaretPos == 5){ CaretPos -= 2; } else { CaretPos -= 1; } setCaretPosition(obj, CaretPos); } console.log(CaretPos); if(obj.value.length > numLength){ if(CaretPos == 8 || CaretPos == 3){ CaretPos += 2; } else { CaretPos += 1; } setCaretPosition(obj, CaretPos); } numLength = obj.value.length; } function getCursortPosition (ctrl) { if (document.selection) { ctrl.focus (); var Sel = document.selection.createRange(); Sel.moveStart (‘character‘, -ctrl.value.length); CaretPos = Sel.text.length; }else if (ctrl.selectionStart || ctrl.selectionStart == ‘0‘) CaretPos = ctrl.selectionStart; } function setCaretPosition(ctrl, pos){ if(ctrl.setSelectionRange) { ctrl.focus(); ctrl.setSelectionRange(pos,pos); } else if (ctrl.createTextRange) { var range = ctrl.createTextRange(); range.collapse(true); range.moveEnd(‘character‘, pos); range.moveStart(‘character‘, pos); range.select(); } } </script> </body>
jq 實現銀行卡沒四個數加一個空格 下面有將正則驗證去掉“-” 或“空格”
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title>銀行卡號4位空格</title> <script src="http://j2.58cdn.com.cn/js/jquery-1.8.3.js"></script><!--依賴jquery--> </head> <body> <input type="tel" placeholder="請輸入儲蓄卡卡號" name="cardNum"> <script> //監控input事件 document.querySelector(‘input[name=cardNum]‘).addEventListener(‘input‘, function() { //獲取當前光標位置 var position = this.selectionStart; var v = this.value; //四個字符加一個空格 this.value = v.replace(/\s/g, ‘‘).replace(/(.{4})/g, "$1 "); //優化語句：如果當前位置是空格字符，則自動清除掉 if (this.value.charAt(this.value.length - 1) == ‘ ‘) { this.value = this.value.substring(0, this.value.length - 1); } var input = this; //重新定位光標位置，start和end都需要設置，不然就是截取片段了 //countSpace此方法報錯，但是不影響使用，我也沒解決問題所在，求大神 input.selectionStart = position + countSpace(this.value, position); input.selectionEnd = position + countSpace(this.value, position); }) </script> </body> </html>
用正則驗證去掉“-” 或“空格”
<html> <head> <meta http-equiv="Content-type" content="text/html; charset=utf-8" /> <script type="text/javascript"> var str="187-5332 5214+1000"; // 假如這是你得到的字符串 // 下面進行替換 var str_rep = str.replace(/\+|\-|\s+|\*|\?/g,""); console.log(str_rep); // 不知道是不是你所說的那樣 </script> </head> </html>
js jq 手機號實現(344) 附帶刪除功能 jq 實現銀行卡沒四個數加一個空格 附帶刪除功能