jQuery: Cara menangkap penekanan tombol TAB dalam kotak teks

Saya ingin menangkap penekanan tombol TAB, membatalkan tindakan default dan memanggil fungsi javascript saya sendiri.

Sunting: Karena elemen Anda dimasukkan secara dinamis, Anda harus menggunakan yang didelegasikanon() seperti dalam contoh Anda, tetapi Anda harus mengikatnya ke acara keydown, karena seperti @Marc komentar, di IE acara penekanan tombol tidak menangkap kunci non-karakter:

$("#parentOfTextbox").on('keydown', '#textbox', function(e) { 
  var keyCode = e.keyCode || e.which; 

  if (keyCode == 9) { 
    e.preventDefault(); 
    // call custom function here
  } 
});

Lihat contoh di sini .

Contoh kerja di jQuery 1.9:

$('body').on('keydown', '#textbox', function(e) {
    if (e.which == 9) {
        e.preventDefault();
        // do your code
    }
});

$('#textbox').live('keypress', function(e) {
    if (e.keyCode === 9) {
        e.preventDefault();
        // do work
    }
});

Metode yang ditunjukkan di atas tidak bekerja untuk saya, mungkin saya menggunakan jquery agak lama, lalu akhirnya potongan kode yang ditampilkan di bawah ini berfungsi untuk - memposting kalau-kalau ada orang di posisi yang sama dengan saya

$('#textBox').live('keydown', function(e) {
    if (e.keyCode == 9) {
        e.preventDefault();
        alert('tab');
    }
});

Bagian penting dari menggunakan tombol pada tab adalah mengetahui bahwa tab akan selalu mencoba untuk melakukan sesuatu, jangan lupa untuk "kembali salah" di akhir.

Inilah yang saya lakukan. Saya memiliki fungsi yang berjalan di blur dan fungsi yang bertukar di mana fokus bentuk saya. Pada dasarnya itu menambahkan input ke ujung formulir dan pergi ke sana sambil menjalankan perhitungan blur.

$(this).children('input[type=text]').blur(timeEntered).keydown(function (e) {
        var code = e.keyCode || e.which;
        if (code == "9") {
            window.tabPressed = true;
            // Here is the external function you want to call, let your external
            // function handle all your custom code, then return false to
            // prevent the tab button from doing whatever it would naturally do.
            focusShift($(this));
            return false;
        } else {
            window.tabPressed = false;
        }
        // This is the code i want to execute, it might be different than yours
        function focusShift(trigger) {
            var focalPoint = false;
            if (tabPressed == true) {
                console.log($(trigger).parents("td").next("td"));
                focalPoint = $(trigger).parents("td").next("td");

            }
            if (focalPoint) {
                $(focalPoint).trigger("click");
            }
        }
    });

Coba ini:

$('#contra').focusout(function (){
    $('#btnPassword').focus();
});

Misalkan Anda memiliki TextBox dengan Id txtName

$("[id*=txtName]").on('keydown', function(e) { 
  var keyCode = e.keyCode || e.which; 
  if (keyCode == 9) {
     e.preventDefault();
     alert('Tab Pressed');
 }
}); 

Anda dapat menangkap tab acara menggunakan API JQuery ini .

$( "#yourInputTextId" ).keydown(function(evt) {
   if(evt.key === "Tab")
      //call your function
});

Ini bekerja untuk saya:

$("[id*=txtName]").on('keydown', function(e) { var keyCode = e.keyCode || e.which; if (keyCode == 9) { e.preventDefault(); alert('Tab Pressed'); } });