如何禁用字母和特殊字符的粘贴选项但为数字启用

Question

我使用此代码来限制类型 alphabets 和 characters。

  <script type="text/javascript">
    function isNumber(evt) {
        evt = (evt) ? evt : window.event;
        var charCode = (evt.which) ? evt.which : evt.keyCode;
        if (charCode > 31 && (charCode < 48 || charCode > 57)) {
            return false;
        }
        return true;
    }

</script>
<asp:TextBox ID="txtCode" runat="server" Width="15%"   onkeypress="return isNumber(event)"/>

但我可以 Paste 其中的 alphabets 和 characters（我不想要）。

当我使用此代码时，Paste Option 是 disabled 但是，我不能 Paste 偶数

   <asp:TextBox ID="txtCode" runat="server" Width="15%" ondrop="return false;"
     onpaste="return false;" onkeypress="return isNumber(event)" />

但我想 paste Numbers :(,我该怎么做？.

Answer 1

以下是使用超时的解决方案。

<!DOCTYPE html>
<html>
<body>

<input type="text" id="inputText" onpaste="return isNumber(event);" onkeypress="return isNumber(event)"  value="" size="40">

<p id="demo"></p>

<script>
 function isNumber(evt) {
      evt = (evt) ? evt : window.event;
      var element  = document.getElementById("inputText");
      var initialValue  = element.value;
      if(evt.type == "paste"){
         setTimeout(function() {
           var value  = element.value;
         var pastedText = value.replace(initialValue,"");
            if(!isNaN(pastedText)){
             element.value = value;
            }else{
             element.value = initialValue;
            }
          }, 2);         
      }
      var charCode = (evt.which) ? evt.which : evt.keyCode;
      if (charCode > 31 && (charCode < 48 || charCode > 57)) {
        return false;
      }
      return true;
    }
</script>

</body>
</html>

Answer 2

首先你应该使用 type="number" 在现代浏览器中像 HtML5 一样具有语义意义和表单验证，并且要在所有浏览器中获得实时功能你可以试试这个：

function isNumber(ev) {
    if (ev.type === "paste" || ev.type === "drop") {
        var textContent = (ev.type === "paste" ? ev.clipboardData : ev.dataTransfer).getData('text');
        return !isNaN(textContent) && textContent.indexOf(".") === -1;
    } else if (ev.type === "keydown") {
        if (ev.ctrlKey || ev.metaKey) {
            return true
        };
        var keysToAllow = [8, 46, 48, 49, 50, 51, 52, 53, 54, 55, 56, 57];
        return keysToAllow.indexOf(ev.keyCode) > -1;
    } else {
        return true
    }
}

<input type="number" placeholder="paste numbers only" name="" onpaste="return isNumber(event)" onkeydown="return isNumber(event)" ondrop="return isNumber(event)">

如果要允许 integer 以及 floating point 数字，请删除第二个条件 if && pasteContent.indexOf(".")===-1。但是如果你已经有一个浮点数，允许浮点数会导致问题，所以它是两个 "."

的无效数字

如何禁用字母和特殊字符的粘贴选项但为数字启用

How to Disable Paste option for alphabets and Special Characters but Enabled for Numbers

javascript

asp.net

textbox

numbers

paste