web-dev-qa-db-fra.com

Simuler la pression de la touche de tabulation avec jQuery

J'ai des zones de texte sur une page .net et je souhaite atteindre les objectifs suivants avec jQuery: si l'utilisateur appuie sur retour, le programme devrait se comporter "comme si" il avait utilisé la touche de tabulation, sélectionnant ainsi l'élément suivant. J'ai essayé le code suivant (et quelques autres):

<script type="text/javascript">

jQuery(document).ready(function () {

    $('.tb').keypress(function (e) {
        if (e.keyCode == 13)
        {
            $(this).trigger("keydown", [9]);
            alert("return pressed");
        } 
    });
});

<asp:TextBox ID="TextBox1" runat="server" CssClass="tb"></asp:TextBox>
<asp:TextBox ID="TextBox2" runat="server" CssClass="tb"></asp:TextBox>

mais cela ne fonctionne tout simplement pas! Manquer quelque chose, faire une erreur?

Voici quelques liens que j'ai utilisés

ici

et ici

jquerykeydownsimulate
27
AGuyCalledGerald

Essaye ça:

http://jsbin.com/ofexat

$('.tg').bind('keypress', function(event) {
  if(event.which === 13) {
    $(this).next().focus();
  }
});

ou la version en boucle: http://jsbin.com/ofexat/2

18
czerasz

J'ai créé un plugin jQuery simple qui résout ce problème. Il utilise le sélecteur ': tabbable' de l'interface utilisateur jQuery pour trouver l'élément 'tabbable' suivant et le sélectionne.

Exemple d'utilisation:

// Simulate tab key when enter is pressed           
$('.tb').bind('keypress', function(event){
    if(event.which === 13){
        if(event.shiftKey){
            $.tabPrev();
        }
        else{
            $.tabNext();
        }
        return false;
    }
});
11
Mark Lagendijk

À partir de plusieurs réponses, j'ai combiné la solution parfaite pour moi où entrer agit comme onglet sur les entrées et sélectionne et se concentre sur la prochaine entrée, sélectionnez ou zone de texte tout en permettant d'entrer dans la zone de texte.

 $("input,select").bind("keydown", function (e) {
     var keyCode = e.keyCode || e.which;
     if(keyCode === 13) {
         e.preventDefault();
         $('input, select, textarea')
         [$('input,select,textarea').index(this)+1].focus();
     }
 });
9
Shehbaz

Essaye ça

$(this).trigger({
    type: 'keypress',
    which: 9
});
4
Shai Mishali