触发按钮单击输入键上的ajax

时间:2015-05-08 20:12:17

标签: javascript jquery html keycode

我需要在按下Enter键时触发ajax调用(键码13),但这不会触发按钮正确点击:

<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:link

更新 我添加了其余的功能,现在keyCode功能不再有效。我尝试创建一个$(function () { //code });,但这没有任何区别。删除第1-173行时,功能有效。我想我在这里错过了一些简单的东西......

更新的小提琴:link

2 个答案:

答案 0 :(得分:3)

虽然您可以直接致电.click(),但您可以使用.trigger()。对于这两种方法之间差异的技术见解,this answer将对该主题有所了解。就最佳实践而言,我认为从代码阅读的角度来看,这更直观。此外,您的原始小提琴中存在轻微的语法问题,导致您无法继续前进。

  

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

$('.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 Link

答案 1 :(得分:0)

你的js代码中有一些错误:

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

这是有效的代码 http://jsfiddle.net/4uwaz2yd/6/