Javascript 在enter键上单击ajax的触发器按钮

我需要在按下

Enter

键（keycode 13）时触发ajax调用，但这不会正确触发按钮单击：

<div class="input-group col-md-6">
<input type="text" class="form-control" placeholder="Search by Asset ID" maxlength="64" class="form-control" id="imageid" name="imageid"> <span class="input-group-btn">
<button class="btn btn-default image-search" type="button">Search</button>
</span>
</div>

$('#imageid').keyup(function () {
    this.value = this.value.replace(/[^0-9\.]/g, '');
    if (event.keyCode == 13) {
        alert(keyCode);
        event.preventDefault();
        $('.image-search').click();
    }
});

$('.image-search').on('click', function () {
    $.ajax({
        url: url
        method: 'GET',
    });
}

搜寻
$（'#imageid'）.keyup（函数（）{
this.value=this.value.replace（/[^0-9\.]/g'）；
如果（event.keyCode==13）{
警报（键码）；
event.preventDefault（）；
$（'.image search'）。单击（）；
}
});
$（'.image search'）。在（'click'，函数（）{
$.ajax({
url:url
方法：“GET”，
});
}

JSfiddle：

更新： 我添加了其余的功能，现在

keyCode

功能不再起作用。我尝试创建一个

$（function（）{//code}）；

，但这没有什么区别。当删除第1-173行时，该功能起作用。我想我只是缺少一些简单的东西

---

更新的Fiddle:

同时您可以调用

。单击（）

您可以直接使用。对于这两种方法之间的差异，您可以从技术上了解一些情况。就最佳实践而言，我认为从代码阅读的角度来看，这更直观。此外，您最初的小提琴中有一个小的语法问题，阻碍了您继续前进

对于给定的事件类型，执行附加到匹配元素的所有处理程序和行为

---

---

您的js代码中有一些错误：

  $('.image-search').on('click', function () {
       $.ajax({
        url: url
        method: 'GET',
       });
   })//you missed this ")"

下面是有效的代码

---

正如它在回答中所说的那样，

.trigger（“click”）

和

之间没有区别。click（）

除了由于额外的函数调用而造成的微小性能损失。

。click（）

非常惯用，我看不出任何可读性问题。我也更喜欢

。click（function…

而不是

。“click”，function…

在这个意义上我也这么做。不过，对我来说，在代码块中以编程方式调用

trigger（）

似乎比调用

click（）更冗长

，因为我们确实是在从UI交互的上下文之外触发一个事件到每个人自己的事件，这只是一种风格偏好。它与代码的正确性无关。@sal niro的答案可读性很强，别忘了传递“事件”函数的参数，以使其工作。$（'#imageid'）.keyup（函数（事件）{……}）；@Ravi在函数块中实际调用

事件

是合法的。但是，常见的快捷代码是

e.keyCode

。在这种情况下，需要显式传递事件参数，例如

function（e）{e.keyCode}

$(function() {
    $('#imageid').keyup(function () {
        this.value = this.value.replace(/[^0-9\.]/g, '');
        if (event.keyCode == 13) {
            event.preventDefault();
            $('.image-search').trigger('click');
        }
    });

    $('.image-search').on('click', function () {
        alert('triggered!');
    });
});

  $('.image-search').on('click', function () {
       $.ajax({
        url: url
        method: 'GET',
       });
   })//you missed this ")"