Javascript只允许数字粘贴

Question

Javascript / jQuery：

 $(document).ready(function () {
     $('#txt').bind("paste", function (e) {
         var $this = $(this);
         $this.val($this.val().replace(/[^\d.]/g, ''));
     });
 });

HTML：

<asp:TextBox ID="txt" runat="server"></asp:TextBox>

如果值如下

10-10-20.0a

结果必须如下

1010200

我只想允许它将数值粘贴到文本框中，否则请禁用它。 但是，如果我尝试上述javascript代码，则无法正常工作。

我在JavaScript方面想念哪里？

Answer 1

调用Textbox的change事件的函数，而不是document.ready ：

的HTML

<asp:TextBox ID="txt" runat="server" onchange="onlyNum()"></asp:TextBox>

jQuery查询

    function onlyNum() {
      var $this = $('#txt');
      $this.val($this.val().replace(/\D/g, ''));
    }

Answer 2

您需要确保正确设置了客户端ID模式，否则发出的文本框中的ID可能不会为“ txt”。

https://msdn.microsoft.com/zh-CN/library/system.web.ui.control.clientidmode%28v=vs.110%29.aspx

<asp:TextBox ID="txt" runat="server" ClientIDMode="Static" ></asp:TextBox>

另一种方法是使用CSS类，这对于重用非常有用。

<asp:TextBox ID="txt" runat="server" CssClass="numbers-only" ></asp:TextBox>

而您的jQuery选择器将是：

$("input.numbers-only").on("paste", function(){  
    // do your stuff here
}); 

Answer 3

jQuery事件应为：

$('#.txt').on('paste', function() {...});

在此处查看示例： 捕获粘贴输入

请注意使用超时来允许在操作它之前粘贴该值。

正确处理事件并获取粘贴的值后，即可添加验证。

另请参阅ste-fu关于引用适当字段的答案，因为asp.net默认情况下会将容器的内容附加到您的文本框ID上，而选择器'#txt'将不起作用。