触发按钮单击Enter键上的ajax

Question

当按下Enter键（键码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行时，该功能有效。 我想我只是在这里错过了一些简单的事情...

小提琴更新： 链接

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/