用JavaScript在文本框的回车键上触发一个按钮点击

我有一个文本输入和一个按钮（见下文）。我如何使用JavaScript来**当Enter键在文本框内被按下时触发按钮的点击事件？

在我当前的页面上已经有一个不同的提交按钮，所以我不能简单地把这个按钮变成一个提交按钮。而且，我只想让Enter键在这个文本框内被按下时点击这个特定的按钮，而不是其他。

<input type="text" id="txtSearch" />
<input type="button" id="btnSearch" value="Search" onclick="doSomething();" />
Sam Axe
已编辑的问题 15日 一月 2015 в 3:17
编程
javascript button onkeypress onclick
30日 九月 2008 в 9:32
99 种观点
解决办法

在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: <input id="pw" type="password"><br>
Submit
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: <input id="pw" type="password"><br>
Submit
Black
编辑本段答案4日 二月 2018 в 6:58
评论(15)

想出了这个办法。

<input type="text" id="txtSearch" onkeypress="return searchKeyPress(event);" />
<input type="button" id="btnSearch" Value="Search" onclick="doSomething();" />

<script>
function searchKeyPress(e)
{
    // look for window.event in case event isn't passed in
    e = e || window.event;
    if (e.keyCode == 13)
    {
        document.getElementById('btnSearch').click();
        return false;
    }
    return true;
}
</script>
Anik Islam Abhi
编辑本段答案12日 十一月 2015 в 4:53
评论(3)

让按钮成为提交元素，这样它就会自动出现。

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

请注意，你需要一个包含输入字段的" "元素来实现这个功能（感谢Sergey Ilinsky）。

重新定义标准行为不是一个好的做法，Enter键应该总是调用表单中的提交按钮。

icedwater
编辑本段答案28日 十二月 2015 в 9:25
评论(3)