Question

我正在尝试这样做，当用户在文本框中并按Enter键时，它与单击链接相同，在这种情况下，它应该将它们带到另一页。这就是我所拥有的，它不起作用。

代码

//jQuery 
$(document).ready(function() {

  //if focus is in the input box drivingSchoolInput
  $("#drivingSchoolInput").live("click", function() {

    //if enter key is pressed
    if(e.keyCode == 13) {

        //click the button and go to next page
        $("#button1").click();
    }       
  });   
});

标记

<form>      
  <div class="formDiv">
    <label for="City">Search by Driving School</label>
    <span class="inputBox"><input type="text" name="City" class="input" id="drivingSchoolInput" /></span>
  </div>

  <h4 class="submitButton"><a href="school.html" id="button1">Submit</a></h4>     
</form>

Answer 1

编写一个小的jQuery插件：

jQuery.fn.enter = function(callback) {
   if(!callback) {
      //don't attach if we have garbage.
      return;
   }

   $(this).keydown(function(e) {
       var ev = e || event;
       if(ev.keyCode == 13) {
          callback();
          return false;
       }
   }); 
};

用法：$(element).enter(callback_func);

我希望这会有所帮助。

Answer 2

检查出来：jQuery Event Keypress: Which key was pressed?

我只是在这里整合post的代码：

$('#searchbox input').bind('keypress', function(e) {
 var code = e.keyCode || e.which;
 if(code == 13) { //Enter keycode
   //Do your stuff + form submit
 }
});

PS：我从来没有测试过它，但它“应该”起作用。：P

Answer 3

此代码存在一些主要问题......

第一个，pygorex1 caught：如果你想引用它，你需要指定事件参数......

第二个位于代码的同一区域：您正在尝试检查click事件的处理程序中的键事件！

第三个可以在这一行找到：

            //click the button and go to next page
            $("#button1").click();

...什么也没做，因为你在那个链接上没有事件处理程序，jQuery's click() function does not trigger the browser's default behavior！

相反，尝试这样的事情：

// if a key is pressed and then released
$("#drivingSchoolInput").live("keyup", function(e) {

  // ...and it was the enter key...
  if(e.keyCode == 13) {

    // ...navigate to the associated URL.
    document.location = $("#button1").attr('href');
  }               
});

Answer 4

我想做类似的事情，所以在阅读了上面提到的David K Egghead的建议之后，我想出了这个，当按下输入时，甚至在锚点上触发“点击”。也可以用来“点击”一个按钮！

$(document).keypress(function(event){if(event.keyCode==13){$('.save_icon').trigger("click");}});

Answer 5

这一行需要e：

$("#drivingSchoolInput").live("click", function(e) {

Answer 6

我有一个非常相似的问题。但是，我无法找到完整的解决方案。

我只想将相同的函数附加到2个不同的元素，使用2种不同的方法执行它。例如，Tom想要的：点击一个链接，或者在输入字段中按ENTER键，然后执行相同的功能（即导航到另一个页面）。

Jacob Relkin为“输入”按键提出了一个好主意。我在下面的代码中包含了这个：

所以基于以下简单标记：

<div>
  <label for="myInput">Type Stuff</label>
  <input id="myInput" type="text" value="" />
  <a id="myButton" href="http://google.com">Click me!</a>
</div>

使用此JavaScript（JQuery）代码：

//this is the plugin Jacob Relkin suggested
(function($) {
$.fn.enter=function(callback){
    this.keyup(function(e) {
        var ev = e || event;
        if(ev.keyCode == 13) {
            callback();
            return false;
        }
    }); 
};
})(jQuery);

$(document).ready(function(){

    var fnDoStuff = function() {
        //insert code here
        //for this example I will complete Tom's task
        document.location.href = $("#myButton").attr('href');
    };

    $('#myInput').enter(fnDoStuff);
    $('#myButton').click(fnDoStuff);

 });

通过这种方式，您可以将相同的函数附加到任意数量的元素，并进行任何类型的交互。

Answer 7

我在asp.net LinkButton

中使用了以下内容

        $('#drivingSchoolInput').keypress(function (event) {
            if (event.keyCode == 13) {
                eval($('#button1').attr('href'));
            }
        });

我在标题上也有一个允许搜索的FORM，所以我需要添加另一个步骤来禁止发布FORM。

        $('#drivingSchoolInput').keypress(function (event) {
            if (event.keyCode == 13) {
                $('#header1_ButtonTerm').attr('disabled', 'disabled'); <-- hack added to kill FORM POST
                eval($('#button1').attr('href'));
            }
        });

使用jQuery按下输入键时单击链接

代码

标记

7 个答案: