防止输入文本框中的退格键

Question

防止输入文本框中的退格键

5

我正在制作一个测试打字速度的Web应用程序。

它会提供给用户一些文本来输入，以及一个文本框来输入。如果用户键入错误字符，我会在产生的键事件上使用preventDefault来防止错误字符被输入到文本框中（相反，我会向用户显示错误消息）。

问题是，preventDefault不能阻止退格键的输入。理想情况下，由于错误按键永远不会被输入到文本框中，因此不允许后退是没有意义的。如果用户习惯性地在感知到错误时使用退格键，会导致输入框中的文本变得不正确。这并不影响测试结果，但也不是理想的情况。

如何防止HTML5类型为“text”的输入元素中的后退？

- Carcigenicate

你真的需要防止退格吗？另一种方法可能是检测它发生的时候，然后用应该在那里的内容替换输入元素的框。 - Brandin

@Brandin 我不是“需要”，但我想这么做。我尝试过了，但按键处理程序在文本放置到框中之前就会触发，所以我不能简单地替换退格键，因为直到处理程序触发后才会删除它。 - Carcigenicate

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Michael Mulqueen · Accepted Answer

您需要检测onkeydown而不是onkeypress，这样它就会有效（在Firefox / Safari上测试过）。在某些浏览器上，onkeypress仅限于可打印字符，而onkeydown适用于所有按键事件。

<!doctype html>
<html lang="en">
    <head>
        <script type="text/javascript">
            function no_backspaces(event)
            {
                backspace = 8;
                if (event.keyCode == backspace) event.preventDefault();
            }
        </script>
    </head>
    <body>
        <input id="typeHere" onkeydown="no_backspaces(event);"/>
    </body>
</html>