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

Question

我需要在按下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',
    });
}

JSfiddle：链接

更新：我添加了其余的功能，现在keyCode功能不再工作了。我试着创建一个$(function () { //code });，但这并没有什么不同。当移除第1-173行时，该功能可以工作。我想我只是错过了一些简单的东西。

更新Fiddle: 链接

Answer 1

虽然可以直接调用.click()，但可以使用.trigger()。为了了解这两种方法的不同之处，这个答案将对这一主题做一些说明。就最佳实践而言，我认为从代码阅读的角度来看，这是比较直观的。此外，你的原始小提琴有一个小的语法问题，阻止你前进。

执行与给定事件类型的匹配元素相关联的所有处理程序和行为。

$('.image-search').trigger('click');

$(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!');
    });
});

JSFiddle链路

Answer 2

在js代码中出现了一些错误：

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

下面是工作http://jsfiddle.net/4uwaz2yd/6/的代码