移动web处理input输入框输入银行卡号四位一空格

由于项目上有需求要求输入银行卡号四位一空格的需求，改过好几版发现都有bug,最后优化了一版看起来效果还行，发帖留存。

难点是从中间插入和删除处理光标问题。

首先需要用到获取光标和设置光标的方法。

 // 获取光标位置
 function getCursortPosition(textDom) {
     var cursorPos = 0;
     if (document.selection) {
         // IE Support
         textDom.focus();
         var selectRange = document.selection.createRange();
         selectRange.moveStart('character', -textDom.value.length);
         cursorPos = selectRange.text.length;
     } else if (textDom.setSelectionRange) {
         // webkit support
         textDom.focus();
         cursorPos = textDom.selectionStart;
     }
     return cursorPos;
 }
 // 设置光标位置
 function setCaretPosition(textDom, pos) {
     if (textDom.setSelectionRange) {
         textDom.focus();
         textDom.setSelectionRange(pos, pos);
     } else if (textDom.createTextRange) {
         // IE Support
         var range = textDom.createTextRange();
         range.collapse(true);
         range.moveEnd('character', pos);
         range.moveStart('character', pos);
         range.select();
     }
 }
 /**
  * 账号输入时自动4位一空格
  */
 $(function () {
     var isDelete = false;
     $("input[data-type='acc']").on("keyup", function (e) {
         var elem = this;
         //加timeout是为了处理安卓部分机型系统键盘无法录入的问题如vivo
         setTimeout(function(){
             var str = elem.value;
             var currentPos = getCursortPosition(elem);
             var posAfterText = "";
             var posPreText = "";
             var isNextBlank = false;//后面的是否是空格
             var isPreBlank = false;
             var isLastPos = true;
             if (currentPos != str.length) {//不是最后一个
                 posAfterText = str.substr(currentPos, 1);
                 posPreText = str.substr(currentPos - 1, 1);
                 isNextBlank = /^\s+$/.test(posAfterText);
                 isPreBlank = /^\s+$/.test(posPreText);
                 isLastPos = false;
             }
             if(elem.value.length <= $(elem).attr("maxlength")){//最大长度控制
                 elem.value = elem.value.replace(/\s/g, '').replace(/(\w{4})(?=\w)/g, "$1 ");
             }
             if (isDelete) {
                 if (isPreBlank) {
                     setCaretPosition(elem, currentPos - 1);
                 } else {
                     setCaretPosition(elem, currentPos);
                 }
             } else {
                 if (!isLastPos) {
                     if (isNextBlank) {
                         setCaretPosition(elem, currentPos + 1);
                     } else {
                         setCaretPosition(elem, currentPos);
                     }
                 } else {
                     setCaretPosition(elem, elem.value.length);
                 }
             }
         },0);
     });
     $("input[data-type='acc']").on("keydown", function (e) {
         //console.log("keyCode=" + window.event.keyCode);
         isDelete = window.event.keyCode == 8;//标记用户进行删除操作
     });

 })