当在文本框中按下 Enter 键时，如何使用 JavaScript 触发按钮单击？

使用 JavaScript 在文本框 Enter 键上触发按钮点击

在 Web 开发中，通常需要在表单元素上触发操作，例如按钮，当特定事件发生时。一种常见的情况是在文本输入字段中按下 Enter 键时触发按钮单击。以下是如何使用 JavaScript 实现此目的：

使用 jQuery

jQuery，一个流行的 JavaScript 库，为这个问题提供了一个简单的解决方案：

$("#id_of_textbox").keyup(function(event) {
    if (event.keyCode === 13) {
        $("#id_of_button").click();
    }
});

此代码将 keyup 事件侦听器附加到 ID 为“id_of_textbox”的文本输入字段。当在此输入中按下 Enter 键（keyCode 13）时，它会触发 ID 为“id_of_button”的按钮上的单击事件。

自定义 JavaScript

如果如果您不想使用库，则可以使用纯 JavaScript 实现此功能：

document.getElementById("id_of_textbox").addEventListener("keyup", function(event) {
    if (event.keyCode === 13) {
        document.getElementById("id_of_button").click();
    }
});

此代码执行相同的任务与 jQuery 示例相同，但它使用本机 addEventListener() 方法将 keyup 侦听器附加到文本输入。

示例用法

考虑以下 HTML 标记：

<input type="text">

要触发“btnSearch”按钮，请在“txtSearch”中按下 Enter 键时单击输入，您将使用提供的代码片段之一，相应地替换元素 ID。

以上是当在文本框中按下 Enter 键时，如何使用 JavaScript 触发按钮单击？的详细内容。更多信息请关注PHP中文网其他相关文章！