JQuery: jak wywołać zdarzenie kliknięcia po naciśnięciu klawisza Enter

165

Muszę wykonać zdarzenie kliknięcia przycisku po naciśnięciu klawisza Enter.

Tak jak w tej chwili zdarzenie nie strzela.

Jeśli to możliwe, pomóż mi ze składnią.

$(document).on("click", "input[name='butAssignProd']", function () {
   //all the action
});

to jest moja próba wywołania zdarzenia kliknięcia przy wejściu.

$("#txtSearchProdAssign").keydown(function (e) {
  if (e.keyCode == 13) {
    $('input[name = butAssignProd]').click();
  }
});

jquery key-events

— Arianule
źródło

Może być konieczne uwzględnienie zwrotu false lube.preventDefault();

— geekchic

4

Na marginesie: e.keyCodenie jest to całkowicie cross browser. użyj e.whichzamiast tego.

— Hashem Qolami

4

W takim przypadku POWINIENEŚ użyć keyupzamiast keypresslub keydown. keypress/ keydownzdarzenia są wyzwalane w sposób ciągły, gdy klawisz jest wciśnięty: jsbin.com/uzoxuk/1/edit

— Hashem Qolami

307

wypróbuj to ....

$('#txtSearchProdAssign').keypress(function (e) {
 var key = e.which;
 if(key == 13)  // the enter key code
  {
    $('input[name = butAssignProd]').click();
    return false;  
  }
});

Pokaż fragment kodu

$(function() {

  $('input[name="butAssignProd"]').click(function() {
    alert('Hello...!');
  });

  //press enter on text area..

  $('#txtSearchProdAssign').keypress(function(e) {
    var key = e.which;
    if (key == 13) // the enter key code
    {
      $('input[name = butAssignProd]').click();
      return false;
    }
  });

});

<!DOCTYPE html>
<html>

<head>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min.js"></script>
  <meta charset=utf-8 />
  <title>JS Bin</title>
</head>

<body>
  <textarea id="txtSearchProdAssign"></textarea>
  <input type="text" name="butAssignProd" placeholder="click here">
</body>

</html>

Rozwiń fragment

Znajdź Demo w jsbin.com

— Vijay
źródło

3

W przypadku, gdy ludzie chcą rozpoznać naciśnięcie klawisza "enter" z dowolnego miejsca, możesz zastąpić $ ('# txtSearchProdAssign') i uruchomić na dokumencie $ (dokument) .keypress .......

— dave4jr

Z perspektywy dostępności wygląda na wątpliwe. Czy to na pewno zadziała na wszystkich rodzajach urządzeń z różnymi metodami „selekcji”?

— Jonny

27

Spróbuj tego

$('#twitterSearch').keydown(function(event){ 
    var keyCode = (event.keyCode ? event.keyCode : event.which);   
    if (keyCode == 13) {
        $('#startSearch').trigger('click');
    }
});

Mam nadzieję, że ci to pomoże

— Neeraj Dubey
źródło

4

Czy miałeś na myśli if((event.keyCode || event.which) == 13)? tak, jest to w pełni cross-przeglądarka, która obsługuje Tabklucz w FF.

— Hashem Qolami,

Zgodnie z API , event.keyCodejest zbędny, wystarczy użyć event.which.

— konyak

12

$('#txtSearchProdAssign').keypress(function (e) {
  if (e.which == 13) {
    $('input[name = butAssignProd]').click();
    return false;  
  }
});

Właśnie znalazłem również przesyłanie formularza na „Enter”, który kompleksowo obejmuje większość zagadnień.

— geekchic
źródło

8

Już prawie byłeś. Oto, czego możesz spróbować.

$(function(){
  $("#txtSearchProdAssign").keyup(function (e) {
    if (e.which == 13) {
      $('input[name="butAssignProd"]').trigger('click');
    }
  });
});

Kiedyś trigger()wykonywałem kliknięcie i wiązałem je ze keyupzdarzeniem z keydownpowoduclick zdarzenie składa się z dwóch zdarzeń faktycznie tj . mousedownWtedy mouseup. Tak więc, aby przypominać rzeczy tak samo, jak to możliwe z keydownikeyup .

Oto demo

— Rohit416
źródło

4

Kolejny dodatek do wykonania:

Jeśli dynamicznie dodajesz dane wejściowe, na przykład używając append(), musisz użyć on()funkcji jQuery .

$('#parent').on('keydown', '#input', function (e) {
    var key = e.which;
    if(key == 13) {
        alert("enter");
        $('#button').click();
        return false;
    }
});

AKTUALIZACJA:

Jeszcze skuteczniejszym sposobem byłoby użycie instrukcji switch. Może się też okazać, że jest czystszy.

Narzut:

<div class="my-form">
  <input id="my-input" type="text">
</div>

jQuery:

$('.my-form').on('keydown', '#my-input', function (e) {
  var key = e.which;
  switch (key) {
  case 13: // enter
    alert('Enter key pressed.');
    break;
  default:
    break;
  }
});

— Daniel Dewhurst
źródło

1

IMO używanie instrukcji przełącznika dla pojedynczego warunku jest przesadą.

— nyuszika7h

Jest jednak bardziej wydajne niż instrukcja if.

— Daniel Dewhurst

2

Nie wierzę ci Czy możesz podać źródło?

— Rolf

3

Czy próbujesz naśladować kliknięcie przycisku po naciśnięciu klawisza Enter? Jeśli tak, może być konieczne użycie rozszerzeniatrigger składni.

Spróbuj zmienić

$('input[name = butAssignProd]').click();

do

$('input[name = butAssignProd]').trigger("click");

Jeśli to nie jest problem, spróbuj ponownie przyjrzeć się składni przechwytywania klucza, patrząc na rozwiązania w tym poście: JQuery Event Keypress: Który klawisz został naciśnięty?

— Shaun
źródło

Z api.jquery.com/click - ta metoda jest skrótem do .on („klik”, handler) w pierwszych dwóch odmianach i .trigger („klik”) w trzeciej. więc zrobiłoby to dokładnie to samo.

— Kapsuła

1

Spróbuj tego

<button class="click_on_enterkey" type="button" onclick="return false;">
<script>
$('.click_on_enterkey').on('keyup',function(event){
  if(event.keyCode == 13){
    $(this).click();
  }
});
<script>

— Vishnu Prasad
źródło

1

Możesz użyć tego kodu

$(document).keypress(function(event){
    var keycode = (event.keyCode ? event.keyCode : event.which);
    if(keycode == '13'){
       alert('You pressed a ENTER key.');
    }
});

— sandeep kumar
źródło

1

Wystarczy, że w kodzie umieścisz funkcję prevDefault (),

$("#txtSearchProdAssign").keydown(function (e) 
{
   if (e.keyCode == 13) 
   {
       e.preventDefault();
       $('input[name = butAssignProd]').click();
   }
});

— Arron
źródło

0

JQuery: Zdarzenie kliknięcia przycisku Fire Korzystanie z przycisku Enter Spróbuj tego ::

tabindex = "0" onkeypress = "return EnterEvent (zdarzenie)"

 <!--Enter Event Script-->
    <script type="text/javascript">
        function EnterEvent(e) {
            if (e.keyCode == 13) {
                __doPostBack('<%=btnSave.UniqueID%>', "");
            }
        }
    </script>
    <!--Enter Event Script-->

— JIYAUL MUSTAPHA
źródło

0

     $('#Search').keyup(function(e)
        {
            if (event.keyCode === 13) {
            e.preventDefault();
            var searchtext = $('#Search').val();
            window.location.href = "searchData.php?Search=" + searchtext + '&bit=1';
            }
        });

Rozwiń fragment

— Supriya
źródło

-4

Wydaje się, że jest to teraz domyślne zachowanie, więc wystarczy:

$("#press-enter").on("click", function(){alert("You `clicked' or 'Entered' me!")})

Możesz spróbować w tym JSFiddle

Testowano na: Chrome 56.0 i Firefox (Dev Edition) 54.0a2, oba z jQuery 2.2.x i 3.x

— xDaizu
źródło

2

Wydaje się, że w ogóle nie łapie to prasy „powrotnej”.

— klokop

@klokop Mylisz się, to łapie „powrót” lub „enter”. Właśnie wypróbowałem to sam z jQuery 3 na FF 63, Chrome 69, Safari 10.0.1 i Opera 55, zarówno w ich linku, jak i na osobnej stronie, którą stworzyłem, aby to przetestować. To +1 ode mnie.

— hyperum

używasz przycisku, enter spowoduje wyzwolenie przycisków i znaczników <a>, ale na rozpiętości powiedz, lub ponieważ OP ma zwykłe pole wejściowe, tak nie jest.

— Nickfmc