jQuery: Comment capturer la pression de touche TAB dans une zone de texte

Je veux capturer la pression sur la touche TAB, annuler l'action par défaut et appeler ma propre fonction javascript.

Edit: Étant donné que votre élément est inséré dynamiquement, vous devez utiliser déléguéon() comme dans votre exemple, mais vous devez le lier à l'événement keydown, car comme @Marc le commente, dans IE l'événement keypress ne capture pas les touches non-caractères:

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

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

Consultez un exemple ici .

Exemple de travail dans 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
    }
});

Les méthodes ci-dessus n'ont pas fonctionné pour moi, peut-être que j'utilise un peu vieux jquery, puis enfin l'extrait de code ci-dessous fonctionne pour - publier juste au cas où quelqu'un occuperait ma même position

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

Une partie importante de l'utilisation d'une touche vers le bas sur l'onglet est de savoir que l'onglet essaiera toujours de faire quelque chose déjà, n'oubliez pas de «retourner faux» à la fin.

Voici ce que j'ai fait. J'ai une fonction qui fonctionne sur .blur et une fonction qui permute où se trouve mon focus de formulaire. Fondamentalement, il ajoute une entrée à la fin du formulaire et y va tout en exécutant des calculs sur le flou.

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

Essaye ça:

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

Supposons que vous ayez TextBox avec l'ID txtName

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

Vous pouvez capturer un onglet d'événement à l'aide de cette API JQuery.

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

Cela a fonctionné pour moi:

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