jQuery: วิธีจับปุ่มกด TAB ภายในกล่องข้อความ

ฉันต้องการจับปุ่มกด TAB ยกเลิกการกระทำเริ่มต้นและเรียกใช้ฟังก์ชันจาวาสคริปต์ของฉันเอง

แก้ไข:เนื่องจากองค์ประกอบของคุณถูกแทรกแบบไดนามิกคุณต้องใช้การมอบหมายon()ในตัวอย่างของคุณ แต่คุณควรผูกมันไว้กับเหตุการณ์ keydown เนื่องจากเป็นความคิดเห็น @Marc ใน IE เหตุการณ์ keypress จะไม่จับคีย์ที่ไม่ใช่อักขระ:

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

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

ตรวจสอบตัวอย่างที่นี่

ตัวอย่างการทำงานใน 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
    }
});

วิธีการที่แสดงด้านบนไม่ได้ผลสำหรับฉันอาจเป็นฉันใช้ jquery เก่าบิตจากนั้นในที่สุดข้อมูลโค้ดที่แสดงด้านล่างใช้งานได้ - โพสต์ในกรณีที่ใครบางคนในตำแหน่งเดียวกันของฉัน

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

ส่วนสำคัญของการใช้คีย์ลงบนแท็บคือการรู้ว่าแท็บนั้นจะพยายามทำบางสิ่งอยู่แล้วอย่าลืม "คืนเท็จ" ในตอนท้าย

นี่คือสิ่งที่ฉันทำ ฉันมีฟังก์ชั่นที่ทำงานบน. 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");
            }
        }
    });

ลองสิ่งนี้:

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

สมมติว่าคุณมีกล่องข้อความพร้อมรหัส txtName

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

คุณสามารถจับภาพแท็บกิจกรรมโดยใช้นี้ JQuery API

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

สิ่งนี้ใช้ได้กับฉัน:

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