以编程方式将键发送到输入字段？答案

【问题标题】：Programmatically sending keys to input field?以编程方式将键发送到输入字段？
【发布时间】：2009-09-24 15:31:18
【问题描述】：

我正在为带有自定义键盘的机顶盒编写一个 Web 门户。

键盘有大部分标准字符键，但没有退格键！

由于还有其他一些免费的自定义键，当我在输入字段或文本区域中时，我想将其中一个映射到退格键。

问题是：如何以编程方式向输入字段发送退格键？

或者就此而言：如何以编程方式将任何键（如箭头键）发送到输入字段？

【问题讨论】：

标签： javascript html

【解决方案1】：

假设浏览器支持 W3C 事件模型，您可以创建一个 KeyEvent 并使用输入字段的 dispatchEvent 方法调度它。 mozilla.org 上有一个example (using MouseEvent)。 where I last answered this question 上还有更多链接 ;-)

更新：以下代码已在 Firefox 3.5 中测试，并成功通过文本字段中的字符退格：

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Strict//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>

<script type="text/javascript">

window.onload = function() {
    var field = document.getElementById("foo");
    var button = document.getElementById("bar");
    button.addEventListener("click", function(event) {
        var keyEvent = document.createEvent("KeyboardEvent");
        keyEvent.initKeyEvent("keypress", true, true, null, false, false, false, false, 8, 0);
        field.dispatchEvent(keyEvent);
    }, false);
}

</script>

</head>
<body>
<div>
<input type="text" id="foo" value="abcdef">
<button id="bar" type="button">Fire key event</button>
</div>
</body>
</html>

【讨论】：

看起来 WebKit 不支持 initKeyEvent - 我看看能不能找到解决方法。
这在较新版本的 Firefox（在 Firefox 13.0 中测试）中不起作用，在 IE 中也不起作用。
initKeyEvent() 现在是deprecated，但可以使用KeyboardEvent constructor 代替，例如event = new KeyboardEvent(typeArg, KeyboardEventInit);

【解决方案2】：

如果您使用的是网络浏览器，则不能伪造键盘和鼠标事件等真实输入事件（出于安全原因）。

但是，您将能够检测到正在按下的其他自定义键，因此您可以响应要使用的键的 onKeyDown 事件，并在检测到它被按下时更新输入字段...

【讨论】：

我希望它不会变成那样，但如果你说的是真的，我想这是唯一的解决方案。
您当然可以创建和调度事件。

【解决方案3】：

使用 onkeypress 和 JavaScript。在脚本中，您可以检查输入的字符是否映射到退格并使其对字段中的文本执行该操作。

【讨论】：

【解决方案4】：

这不是您所要求的，但在大多数情况下，Control-H 与退格键相同。

【讨论】：

“但是Control-H”是什么意思，发送CTRL+H？
在我用过的任何浏览器中，CTRL+H 都会显示历史记录。