Kích hoạt sự kiện trên `click` và` enter`

Question

Tôi có hộp tìm kiếm trên trang web của mình. Hiện tại, người dùng phải nhấp vào nút gửi bên cạnh hộp để tìm kiếm qua bài đăng của jquery. Tôi muốn cho phép người dùng cũng nhấn enter để tìm kiếm. Tôi có thể làm cái này như thế nào?

jQuery:

$('document').ready(function(){ 
    $('#searchButton').click(function(){ 
     var search = $('#usersSearch').val(); 
     $.post('../searchusers.php',{search: search},function(response){ 
      $('#userSearchResultsTable').html(response); 
     }); 
    }); 
}); 

HTML:

<input type='text' id='usersSearch' /><input type='button' id='searchButton' value='search' /> 

Answer 1

Sử dụng sự kiện keypress trên usersSearch textbox và tìm kiếm Nhập nút. Nếu nhấn nút enter, hãy kích hoạt sự kiện nhấn nút tìm kiếm sẽ thực hiện phần còn lại của công việc. Thử cái này.

$('document').ready(function(){ 
    $('#searchButton').click(function(){ 
     var search = $('#usersSearch').val(); 
     $.post('../searchusers.php',{search: search},function(response){ 
      $('#userSearchResultsTable').html(response); 
     }); 
    }) 
    $('#usersSearch').keypress(function(e){ 
     if(e.which == 13){//Enter key pressed 
      $('#searchButton').click();//Trigger search button click event 
     } 
    }); 

}); 

Demo

Answer 2

Something như thế này sẽ làm việc

$('#usersSearch').keypress(function(ev){ 
    if (ev.which === 13) 
     $('#searchButton').click(); 
}); 

Answer 3

$('#form').keydown(function(e){ 
    if (e.keyCode === 13) { // If Enter key pressed 
     $(this).trigger('submit'); 
    } 
}); 

Answer 4

Hãy nhìn vào các keypressfunction.

Tôi tin rằng chìa khóa enter là 13 do đó bạn sẽ muốn một cái gì đó như:

$('#searchButton').keypress(function(e){ 
    if(e.which == 13){ //Enter is key 13 
     //Do something 
    } 
}); 

Answer 5

$('#usersSearch').keyup(function() { // handle keyup event on search input field 

    var key = e.which || e.keyCode; // store browser agnostic keycode 

    if(key == 13) 
     $(this).closest('form').submit(); // submit parent form 
} 

Answer 6

Bạn gọi cả hai nghe sự kiện sử dụng .on() sau đó sử dụng một if bên trong hàm:

$(function(){ 
    $('#searchButton').on('keypress click', function(e){ 
    var search = $('#usersSearch').val(); 
    if (e.which === 13 || e.type === 'click') { 
     $.post('../searchusers.php', {search: search}, function (response) { 
     $('#userSearchResultsTable').html(response); 
     }); 
    } 
    }); 
});