在文本框中的 Enter 键上使用 JavaScript 触发按钮单击

Question

我有一个文本输入和一个按钮（见下文）。当在文本框中按下 <input type="text" id="txtSearch" /> <input type="button" id="btnSearch" value="Search" onclick="doSomething();" /> 键时，如何使用 JavaScript 触发按钮的单击事件？

我的当前页面上已经有一个不同的提交按钮，所以我不能简单地将按钮设置为提交按钮。而且，我 只 希望在这个文本框中按下 ---1--- 键来单击此特定按钮，仅此而已。

---2---

原文由 kdenney 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

在 jQuery 中，以下将起作用：

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

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

 $("#myButton").click(function() {
 alert("Button code executed.");
 });

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

 Username:<input id="username" type="text"><br>
 Password:&nbsp;<input id="pw" type="password"><br>
 <button id="myButton">Submit</button>

或者在纯 JavaScript 中，以下内容会起作用：

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

 document.getElementById("pw")
 .addEventListener("keyup", function(event) {
 event.preventDefault();
 if (event.keyCode === 13) {
 document.getElementById("myButton").click();
 }
 });

 function buttonCode()
 {
 alert("Button code executed.");
 }

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

 Username:<input id="username" type="text"><br>
 Password:&nbsp;<input id="pw" type="password"><br>
 <button id="myButton" onclick="buttonCode()">Submit</button>

原文由 Steve Paulo 发布，翻译遵循 CC BY-SA 3.0 许可协议

Answer 2

然后只需将其编码！

 <input type = "text"
       id = "txtSearch"
       onkeydown = "if (event.keyCode == 13)
                        document.getElementById('btnSearch').click()"
/>

<input type = "button"
       id = "btnSearch"
       value = "Search"
       onclick = "doSomething();"
/>

原文由 Sergey Ilinsky 发布，翻译遵循 CC BY-SA 3.0 许可协议