如何使用jQuery在输入文本字段中仅允许数字（即使复制粘贴时）？

Question

我正在使用此jQuery代码，仅允许在输入文本字段中输入数字。

jQuery(document).ready(function() {     
    jQuery( '.only_numbers' ).keydown(function (e) {
        // Allow: backspace, delete, tab, escape, enter and .
        if (jQuery.inArray(e.keyCode, [46, 8, 9, 27, 13, 110, 190]) !== -1 ||
             // Allow: Ctrl+A, Command+A
            ((e.keyCode === 65) && (e.ctrlKey === true || e.metaKey === true)) || 
             // Allow: home, end, left, right, down, up
            (e.keyCode >= 35 && e.keyCode <= 40)) {
                 // let it happen, don't do anything
                 return;
        }
        // Ensure that it is a number and stop the keypress
        if ((e.shiftKey || (e.keyCode < 48 || e.keyCode > 57)) && (e.keyCode < 96 || e.keyCode > 105)) {
            e.preventDefault();
        }
    });
});

除一个小问题外，此方法工作正常。它不允许在该字段中粘贴任何内容。仅当字符串包含所有数字字符时，如何允许用户在字段中粘贴字符串？

另外，如果我可以对只允许字母的输入文本字段执行相同的操作，那就太棒了。

Answer 1

您的HTML

 <input type='text' />

你的jQuery

 $('input').on('paste', function (event) {
  if (event.originalEvent.clipboardData.getData('Text').match(/[^\d]/)) {
    event.preventDefault();
  }
});

$("input").on("keypress",function(event){
                if(event.which <= 48 || event.which >=57){
                    return false;
                }
            });

工作codepen https://codepen.io/anon/pen/pwEXyg

Answer 2

您可以使用正则表达式来实现。

仅数字。

function process(input){
  let value = input.value;
  let numbers = value.replace(/[^0-9]/g, "");
  input.value = numbers;
}

<input type="text" oninput="process(this)">

仅字母。

function process(input){
  let value = input.value;
  let letters = value.replace(/[0-9]/g, "");
  input.value = letters;
}

<input type="text" oninput="process(this)">