Question

我正在尝试让textfield只允许数字。（即“0-9”不是小数。）我来this popular answer说：

<input type="text" onkeypress='return event.charCode >= 48 && event.charCode <= 57'></input>

我试过了，但问题是，它允许你粘贴任何字符。我怎么能禁止粘贴的'非法'字符？此外，此代码是否适用于不同的键盘，如德语键盘？

请勿发布type="number"。我之所以没有使用它，原因很多。

Answer 1

您可以intercept the paste event专门处理您的案件。

Answer 2

拦截oninput事件并处理粘贴的文本。请注意，此事件也会在键输入上触发。

<script>
function validate(element) {
  if (element.value.match('\\D')) {
    alert('Please enter only numeric values\n(You entered ' + element.value + ')');
    element.value = '';
  }
}
</script>

<input type="text" oninput="validate(this);">

Answer 3

HTML代码：

<form name="myForm" action="" onsubmit="return checkInp()" method="post">
  First name: <input type="text" name="age">
 <input type="submit" value="Submit">

Javascript代码：

function checkInp()
   {
     var x=document.forms["myForm"]["age"].value;
       if (isNaN(x)) 
          {
            alert("Must input numbers");
            return false;
          }
   }

Answer 4

您可以使用按键事件，每次输入新字符时都会检查输入。

<fieldset>
  <label for="phone">Phone:</label>
  <input type="text" id="phone" />
</fieldset>

{{1}}

Answer 5

对于用户友好的界面，通常最好根据输入的实际值进行验证，因此不要使用charCode，请使用输入的值。为此，一个简单的正则表达式适合：

if (/\D/.test(value)) {
  // a non–digit was entered
}

通常最好验证用户何时完成输入，例如对于银行我可以复制并粘贴我的信用卡余额为“1,203.43”，然后删除逗号。然后，当我使用合适的屏幕消息离开它（onblur或onsubmit）时，该字段被验证，如果它错了，请让我修复它。

但在某些情况下，它也适合使用keyup或其他一些合适的事件。

因此，如果输入只有数字，您可能会执行以下操作：

function validate(el) {
  if (el.classList.contains('numsOnly')) {
    document.getElementById(el.id + 'Err').innerHTML = /\D/.test(el.value)? "Must contain only digits" : '';
  }
}

.screenHint {font: sans-serif; font-size: 80%; color: #999999}

<label for="aNum">A number:<input name="aNum" id="aNum" class="numsOnly"
       onblur="validate(this)" onkeyup="validate(this)" onpaste="validate(this)"
       placeholder="1234"></label><span class="screenHint">Digits only</span><br>
<span style="color:red; background-color: white;" id="aNumErr"></span>

当然，您可能会动态添加侦听器并拥有更广泛的验证集，但上面显示了一些原则。

文本输入数字验证

5 个答案: