Question

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

<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”执行搜索的可能性？

Answer 1

首先：添加一个表单（这应该有一个服务器端回退，无论JavaScript做什么）。

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

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

Answer 2

当您的输入处于表单中时，输入应自动提交表单

否则：

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

我建议您将按钮更改为type =“submit”，但输入功能会自动生效，然后在提交事件处理程序中执行Search（）代码

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

Answer 3

<!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>

这就是全部

Answer 4

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

希望这会对你有帮助..

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

4 个答案: