Jquery: cara memicu event klik pada menekan tombol enter

165

Saya perlu menjalankan acara klik tombol setelah menekan tombol enter.

Karena saat ini acara tidak menembak.

Tolong Bantu saya dengan sintaks jika memungkinkan.

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

ini adalah usaha saya untuk memecat acara klik pada saat masuk.

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

jquery key-events

— Arianule
sumber

Anda mungkin harus menyertakan return false atau ae.preventDefault();

— geekchic

4

SEBAGAI catatan tambahan: e.keyCodetidak sepenuhnya lintas browser. gunakan e.whichsaja.

— Hashem Qolami

4

Dalam hal ini, Anda HARUS menggunakan keyupalih-alih keypressatau keydown. keypress/ keydownevents memicu terus menerus ketika tombol ditekan: jsbin.com/uzoxuk/1/edit

— Hashem Qolami

307

coba ini ....

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

Tampilkan cuplikan kode

$(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>

Luaskan cuplikan

Temukan Demo di jsbin.com

— Vijay
sumber

3

Jika orang ingin mengenali penekanan tombol "enter" dari mana saja, Anda dapat mengganti $ ('# txtSearchProdAssign') dan memicu pada dokumen $ (dokumen). Tekan tombol .......

— dave4jr

Terlihat dipertanyakan dari perspektif aksesibilitas. Apakah ini pasti akan bekerja di semua jenis perangkat yang memiliki metode "seleksi" yang berbeda?

— Jonny

26

Coba ini

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

Semoga ini bisa membantu Anda

— Neeraj Dubey
sumber

4

Apakah maksud Anda if((event.keyCode || event.which) == 13)? ya, ini sepenuhnya lintas peramban yang mendukung Tabkunci dalam FF.

— Hashem Qolami

Menurut API , event.keyCodeitu berlebihan, cukup gunakan event.which.

— konyak

12

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

Saya juga baru saja menemukan mengirimkan formulir di 'Enter' yang mencakup sebagian besar masalah secara komprehensif.

— geekchic
sumber

8

Anda hampir sampai. Inilah yang bisa Anda coba.

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

Saya sudah terbiasa trigger()mengeksekusi klik dan mengikatnya pada keyupacara insted keydownkarena clickacara terdiri dari dua peristiwa sebenarnya yaitu mousedownkemudian mouseup. Sehingga menyerupai hal-hal yang sama mungkin dengan keydowndan keyup.

Ini Demo

— Rohit416
sumber

4

Tambahan lain untuk dibuat:

Jika Anda menambahkan input secara dinamis, misalnya menggunakan append(), Anda harus menggunakan on()fungsi jQuery .

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

MEMPERBARUI:

Cara yang lebih efisien untuk melakukan ini adalah dengan menggunakan pernyataan switch. Anda mungkin merasa lebih bersih juga.

Markup:

<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
sumber

1

IMO menggunakan pernyataan switch untuk satu kondisi adalah berlebihan.

— nyuszika7h

Ini lebih efisien daripada pernyataan if.

— Daniel Dewhurst

2

Aku tidak percaya kamu Bisakah Anda mengutip sumber?

— Rolf

3

Apakah Anda mencoba meniru klik pada tombol ketika tombol enter ditekan? Jika demikian, Anda mungkin perlu menggunakan triggersintaks.

Coba ubah

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

untuk

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

Jika ini bukan masalahnya, maka coba perhatikan sintaks tangkap kunci Anda dengan melihat solusi di posting ini: jQuery Keypress Peristiwa: Tombol mana yang ditekan?

— Shaun
sumber

Dari api.jquery.com/click - Metode ini adalah cara pintas untuk .on ("klik", penangan) di dua variasi pertama, dan .trigger ("klik") di yang ketiga. sehingga akan melakukan hal yang persis sama.

— Kapsul

1

Coba ini

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

— Wisnu Prasad
sumber

1

Anda dapat menggunakan kode ini

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

— sandeep kumar
sumber

1

Cukup sertakan fungsi preventDefault () dalam kode,

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

— Arron
sumber

0

Jquery: acara klik Tombol Api Menggunakan Tombol enter Tekan coba ini ::

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

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

— JIYAUL MUSTAPHA
sumber

0

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

Luaskan cuplikan

— Supriya
sumber

-4

Ini tampaknya menjadi perilaku default sekarang, jadi cukup untuk melakukannya:

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

Kamu bisa mencobanya di JSFiddle ini

Diuji pada: Chrome 56.0 dan Firefox (Dev Edition) 54.0a2, keduanya dengan jQuery 2.2.x dan 3.x

— xDaizu
sumber

2

Ini sepertinya tidak menangkap pers 'kembali' sama sekali.

— klokop

@klokop Anda salah, ini menangkap 'kembali' atau 'masuk'. Saya baru saja mencobanya sendiri dengan jQuery 3 di FF 63, Chrome 69, Safari 10.0.1, dan Opera 55, baik pada tautan mereka dan di situs terpisah yang saya buat untuk mengujinya sendiri. Itu +1 dari saya.

— hyperum

Anda menggunakan tombol, masukkan akan memicu tombol dan tag <a> tetapi pada rentang mengatakan atau karena OP memiliki bidang input reguler, ini bukan masalahnya.

— Nickfmc