javascript - 在输入时验证 html 文本输入

Question

在输入时验证 HTML 文本输入的最佳方法是什么？我所知道的所有方法都有一些缺点:

1. 使用 $.keypress 您只能访问输入的旧值，而不能访问新值。此外，将不会检测到某些事件(例如使用鼠标进行剪切/粘贴)。

2. 使用 $.change 仅在输入失去焦点时有效。

3. This question提出了一个解决方案，您可以在其中使用轮询来监视属性更改。原则上，可以在回调中验证新值，如果无效则恢复为旧值。但是，除了需要轮询之外，我不确定它是否没有竞争条件。

4. This article建议在存在时使用浏览器特定的功能，如果没有可用的功能则回退到轮询。看起来是迄今为止最好的方法。

5. [Update] 正如答案中所指出的，$.keyup 允许访问更新后的值。但是，它不仅不能用于鼠标剪切/粘贴，而且如果您按住某个键也会失败，只有在输入很多后才松开。或者，如果结合 keydown 和 keyup 来保存/恢复旧值，如果用户键入太快，它会中断。

以上解决方案都没有错误或真正安全的跨浏览器。是否有更好的解决方案，无论是现成的还是正在制作中的？似乎是一个普遍的问题，我试图回答similar questions最近，没有成功，我也对答案感兴趣。

(也欢迎反对这种做法的好论据，以防万一实现此验证会出现新问题；但是，这在其他语言中似乎很常见，所以我怀疑想要是一件坏事)

Answer 1

您可以使用 input (FF) 和 propertychange(所有其他)事件来捕获所有形式的输入，包括键盘和人民币剪切粘贴。

http://jsfiddle.net/dFBzW/

$('input').bind('input propertychange', function() {
    $('#output').html($(this).val());
});