控制ENTER键

时间:2012-06-04 19:30:17

标签: javascript jquery forms

我们怎样才能使页面中的表单在按 Enter 时提交 - 而不是。它与按特定按钮或图标或图像的工作相同吗?

以下是我的表格内容:

<input type="text" id="txt" /><input type="button" value="search"            
 onclick="searchresult()" />

问题在于,如果我按 Enter ,表单提交并且文本字段会自行清除,但函数searchresult()不会显示其效果。只按下按钮,效果很好。

4 个答案:

答案 0 :(得分:5)

<强> HTML

<input type="text" id="txt"/>
<input type="button" value="search"/>

<强>的jQuery

$('input[type=text]').on('keyup', function(e) {
  if(e.which == 13) {   // 13 is keycode for enter
    e.preventDefault();
  }
})

您也可以像{<1}}一样绑定

submit()

不要忘记将代码放在

$('form').submit(function(e) {  // instead of only `form`, 
                                // use with `id` or `class` combination
   if(e.which == 13) {
     e.preventDefault();
   }
});

简而言之

$(document).ready(function() {
   // your code
});

答案 1 :(得分:1)

尝试:

$('form').submit(function(event){
    if(!$(':focus',this).is(':button'))
        event.preventDefault();
});

这附加到表单本身。如果以任何其他方式提交单击提交按钮,则会暂停提交过程。为了获得更好的性能,请缩小'form'选择器的范围。

答案 2 :(得分:1)

或者,您可以在提交表单之前绑定到onsubmit事件以执行任何处理,而不是禁用回车键。来自MDN documentation

  

当用户单击表单()中的提交按钮时,将引发提交事件。

答案 3 :(得分:0)

试试这个:

形式

<form id="myForm">
<input type="text" id="txt" />
<input type="submit" value="search" />
</form>

JS

<script>
$(document).ready(function(){
    $("#myForm").submit(function(e){
        e.preventDefault();
        searchresult();
    });
});
</script>