web-dev-qa-db-fra.com

Déclencher un événement sur `click` et` enter`

J'ai une zone de recherche sur mon site qui. Actuellement, les utilisateurs doivent cliquer sur le bouton d'envoi en regard de la zone pour effectuer une recherche via le message de jquery. J'aimerais que les utilisateurs appuient également sur Entrée pour effectuer une recherche. Comment puis-je faire ceci?

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' />
jqueryjquery-selectors
70
kirby

Utilisez l'événement keypress dans la zone de texte usersSearch et recherchez Enter bouton. Si le bouton Entrée est enfoncé, déclenchez l'événement de clic du bouton de recherche qui fera le reste du travail. Essaye ça.

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

});

Démo

99
ShankarSangoli

Vous appelez les deux écouteurs d'événement à l'aide de .on(), puis utilisez un if à l'intérieur de la fonction:

$(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);
      });
    }
  });
});
50
Gustavo Rodrigues

Quelque chose comme ça va marcher

$('#usersSearch').keypress(function(ev){
    if (ev.which === 13)
        $('#searchButton').click();
});
5
jopke
$('#form').keydown(function(e){
    if (e.keyCode === 13) { // If Enter key pressed
        $(this).trigger('submit');
    }
});
2
elclanrs
$('#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
}
1
xandercoded

vous pouvez utiliser ci-dessous l'événement de frappe au chargement du document.

 $(document).keypress(function(e) {
            if(e.which == 13) {
               yourfunction();
            }
        });

Merci

1
Asif Ghanchi

Jetez un coup d'œil au keypressfonction .

Je crois que la clé enter est 13 donc vous voudriez quelque chose comme:

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