不仅在“按键”事件上允许在“输入”上浮动

Posted 2023-05-09

【中文标题】不仅在“按键”事件上允许在“输入”上浮动

【英文标题】：Allow float on 'input' not only on 'keypress' event

【发布时间】：2017-10-10 17:54:15

【问题描述】：

我有这个代码来接受有效的int 或float 数字。

$("input").on("keypress", function(event) 
       $(this).val($(this).val().replace(/[^0-9\.]/g, ''));
       if ((event.which != 46 || $(this).val().indexOf('.') != -1) && (event.which < 48 || event.which > 57)) 
         event.preventDefault();
       
);

但是，我无法通过 copy-paste 和 rightclick-paste 事件捕获用户输入数据。

我尝试了$("input").on("input",...，但没有工作。请看下面的小提琴演示。

Fiddle Demo

【问题讨论】：

输入应该有效，什么不完全有效？

@epascarello 输入事件不起作用jsfiddle.net/jcjncyr6/2

粘贴在那里为我工作....

如果您粘贴此文本“不应粘贴”会怎样？

不为我粘贴...如果有数字，则粘贴。

【参考方案1】：

您可以仅在 0 毫秒 setTimeout 之后监听粘贴事件并检查数字，以让值被粘贴。您会看到粘贴的任何内容的闪烁，因此这不是理想的解决方案，但可能是可行的。

$("input").on("keypress", function(event)   
  $(this).val($(this).val().replace(/[^0-9\.]/g, ''));   
  if ((event.which != 46 || $(this).val().indexOf('.') != -1) && (event.which < 48 || event.which > 57)) 
    event.preventDefault();
  
);


$("input").on("paste", function(event) 
  var element = $(this);
   setTimeout(function()
     element.val(element.val().replace(/[^0-9\.]/g, ''));
   , 0);
);