当文本框处于活动状态时，“Enter”键调用 javascript 函数答案

【问题标题】："Enter" key calls a javascript function when textbox is active当文本框处于活动状态时，“Enter”键调用 javascript 函数
【发布时间】：2014-07-19 01:13:14
【问题描述】：

我有一个文本框和一个按钮

<div class="TextField Large">
    <input type="text" name="q" id="SearchBox" />
</div>
<div style="height: 40px; text-align: right; position: absolute; top: 0px; right: 0px;">
    <input type="button" value="Search" class="Button" onclick="Search()" />
</div>

基本上你在文本框中输入一个文本，当你点击搜索按钮时，一个 JavaScript 函数 Search() 被调用。

如何添加当用户输入文本并在键盘上按“Enter”时执行搜索的可能性？

【问题讨论】：

标签： javascript jquery html

【解决方案1】：

首先：添加一个表单（无论 JavaScript 做什么，它都应该有一个服务器端后备）。

第二：将按钮改为提交按钮。

第三：将 JavaScript 移动到表单的提交事件而不是按钮的客户端事件。

【讨论】：

【解决方案2】：

<!DOCTYPE HTML>
<html>
<head>
<script type="text/javascript">
function Search(){
    alert("search!");
    //search logic
    return false;
}
</script>
</head>
<body>
    <form onsubmit="return Search()">
        <input type="text" name="q" />
        <input type="submit" value="Search" />
    </form>
</body>
</html>

就是这样

【讨论】：

【解决方案3】：

当您在表单中输入时，应自动提交表单，

否则：

$('your form').keyup(function(e) {
  if(e.which == 13) $(this).submit();
});

我建议您将按钮更改为 type="submit" 以使输入功能自动工作，然后在提交事件处理程序中执行 Search() 代码

$('your form').submit(function() {
  // your search code
}

【讨论】：

【解决方案4】：

$('#textbox').keypress(function(event){
   var keycode = (event.keyCode ? event.keyCode : event.which);
   if(keycode == '13'){
      alert('You pressed a "enter" key in textbox');    
   }
});

希望这会对你有所帮助..

【讨论】：