限制输入以逗号分隔的形式输入数字

Question

我想写一个允许只有数字并自动转换为逗号分隔形式的jQuery脚本。我写了这个代码（这是部分代码）：

function FillNumericalField(e, inp, CommaSeperated) { 
     var MainCharKey = e.which.toString(); 
     var IsShiftPresses = e.shiftKey; 

     if (dict_NumbersOnly[MainCharKey] == null || dict_NumbersOnly[MainCharKey] == 'undefined') { 
      e.preventDefault(); 
     } 
     else { 
      var NewChar = ''; 
      if (isValidDigitToShow(dict_NumbersOnly, MainCharKey)) { 
       e.preventDefault(); 
       NewChar = dict_NumbersOnly[MainCharKey]; 
       setValue(inp, NewChar, CommaSeperated); 
      } 
     } 
    } 

    $(document).on('keydown', '.NumbersOnly', function (e) { 
     FillNumericalField(e, $(this), false); 
    }); 

和逗号分拆：

function CommaSeperation(str) { 
     return str.replace(/,/g, '').replace(/(\d)(?=(\d\d\d)+(?!\d))/g, "$1,"); 
    } 

的问题是，当我要在众多的年底进入数字（例如'123'）光标在3之后保持不为4.

以前是否有人写过类似的代码？

感谢

Answer 1

这里是我的解决方案，与一些意见：

function NumbersOnly(e) { 
    if (e.type == 'keypress') { // detect the event type 
     // __on keypress__, prevent the user from typing forbidden chars 
     var char = String.fromCharCode(e.charCode); 
     return (
      // test if char is numeric or " ,/. " 
      (e.charCode == 0 || /[0-9,.\-]/.test(char)) 
      && 
      // test if char is " ,/. " : prevent input if the value already contains a " ,/. " 
      (!/[\.,]/.test(e.target.value) || !/[\.,]/.test(char)) 
      && 
      // negative numbers fix 
      (!/[\-]/.test(char) || (!/^\-/.test(e.target.value) && e.target.selectionStart == 0)) 
     ); 
    } else { 
     // __on keyup__ and __on paste__, convert "." to "," 
     if (/[\.,]/.test(e.target.value) || /(?!^)[\-]/g.test(e.target.value)) { 
      var caret_position = e.target.selectionStart; 
      e.target.value = e.target.value 
           // convert "." to "," 
           .replace('.', ',')  
           // on paste : remove forbidden characters 
           .replace(/[^0-9,\-]/g, '') 
           .replace(/(?!^)[\-]/g, ''); 
      // Fix multiple comma on paste : keep the first one, merge the others numbers 
      var multiCommaFixer = e.target.value.split(','); 
      multiCommaFixer = multiCommaFixer[0]+','+multiCommaFixer.slice(1, multiCommaFixer.length).join(''); 
      e.target.value = multiCommaFixer; 
      e.target.setSelectionRange(caret_position, caret_position); 
     } 
    } 
} 

$(document).on('keypress keyup paste', '.NumbersOnly', function (e) { 
    return NumbersOnly(e); // the same function will be used for both events 
}); 

You can try the JSFiddle demo here