Taper le caractère de tabulation dans les zones de texte du navigateur

Bien souvent, lorsque je veux formater du texte dans la zone de texte d'une page Web, j'appuie sur la Tabtouche.

Malheureusement, cela n'insère pas le caractère de tabulation mais déplace le contrôle vers l'élément de formulaire suivant (comme un bouton ou une case à cocher).

Pour les navigateurs tels que Firefox / IE, existe-t-il un moyen d'obtenir le comportement de la mise en forme d'un onglet dans une zone de texte en saisissant une combinaison de touches?

Tabinta est un add-on Firefox qui vous permet de faire cela.

Sous Windows, vous pouvez appuyer sur Alt+ 09. Cela ne fonctionne qu'avec les touches numériques du pavé numérique. (Relâchez Altaprès avoir appuyé sur la dernière touche numérique.)

Linux et autres systèmes POSIX (sauf Mac OS):

Pour entrer des onglets dans les applications GTK + (comme Firefox ou Chrome):

1. Ctrl+ Shift+U

2. Type 9

3. Presse SpaceouEnter

Source: Wikipedia: Entrée Unicode

Dans Safari et Firefox sur Mac OS X, vous pouvez appuyer sur ControlOptionTabpour insérer un onglet dans le champ de texte en cours de modification.

Ouvrez le Bloc-notes ou un éditeur de texte similaire et créez un nouveau document vierge. Type Tab. Copiez votre caractère de tabulation dans le presse-papiers. (Sous Windows, Ctrl+ A, Ctrl+ le Cfera).

Revenez maintenant à la zone de texte de votre navigateur. Placez le curseur où vous le souhaitez et collez le caractère de tabulation. ( Ctrl+ Vsur Windows).

Voilà, c'est fini!

Il existe un plugin Chrome appelé Textarea Code Formatter .

Il vous permet d'insérer des onglets dans des zones de texte du navigateur Chrome. Il vous permet également de mettre en évidence plusieurs lignes et d'insérer des onglets avant chaque ligne sélectionnée.

Cependant, le problème est que vous souhaitez souvent un comportement d'insertion d'onglets standard. Si vous utilisez l'onglet pour basculer entre les cases, vous pouvez alors sélectionner "désactivé" par défaut dans les options.

Si c'est votre site:

plugin jQuery: http://teddevito.com/demos/textarea.html

jQuery(document).ready(function () {

     $("textarea").tabby();

});

Commencez par charger jQuery et le plug-in, puis vous pouvez faire un onglet et créer un onglet, puis décaler + tab sur "untab" pour ainsi dire.

Pour une prise en charge à l’échelle du navigateur, vous devrez utiliser une extension, un script utilisateur, un plugin, etc., comme: 46704 pour Greasemonkey .

Le gros avantage de Tabinta dans Firefox est que vous pouvez mapper le caractère de tabulation sur un autre raccourci clavier, car vous ne voulez vraiment pas perdre le comportement par défaut de la clé de tabulation dans le navigateur.

Avec Internet Explorer, vous n'avez aucune solution en termes d'extensions de navigateur que je sache. Ici, le seul moyen est de conserver le caractère de tabulation dans le presse-papiers en l’ayant copié au préalable dans un autre programme tel que le bloc-notes.

Les solutions javascript nécessitent le nom de la zone de texte sur laquelle elles vont agir, ce qui est loin d'être idéal ou pratique. Tandis que les combinaisons de codes de touches alt sous les deux navigateurs exécutent toujours l'événement de frappe de caractère de tabulation normal, elles ne fonctionnent donc pas non plus.

J'ai un peu gâché l'esprit avec AutoHotkey pour obtenir cette capacité, et la seule solution «à l'épreuve des balles» que j'ai trouvée est vraiment de coller (pas d'envoyer) le caractère de tabulation lui-même.

;
; TAB character
; pasted from clipboard
; win tab
;
#tab::
old_clip:=clipboard
clipboard:=A_Tab
clipWait
sendInput,^v
clipboard:=old_clip
clipWait
return

Il s'avère que cette liaison AHK est même utile dans les éditeurs de texte qui gèrent la frappe de touche TAB supplémentaire; par exemple. IDE configuré pour utiliser autoindent par espaces.

Tab Grabber est un peu comme Tabinta, uniquement pour Chrome (autorise les tabulations dans les champs textarea).

Utilisez le tabby de jQuerry! Prend en charge la sélection de ligne et appuyez sur la touche Tab ou Maj Tab

http://www.herby.sk/trapped/bower_components/jquery-tabby/textarea.mirror.html

Pour taper la touche de tabulation dans une zone de texte, vous pouvez utiliser un script comme celui-ci (la zone de texte qui accepte les touches de tabulation est nommée txtLongText):

[VB.NET]

txtLongText.Attributes.Add("onkeydown", _
"if(event.which || event.keyCode){if ((event.which == 9)" & _ 
"|| (event.keyCode == 9)) {document.getElementById('" & _ 
txtLongText.ClientID + "').selection = " & _
document.selection.createRange();" & _ 
txtLongText.ClientID & ".selection.text = " & _
" String.fromCharCode(9);return false;}} else {return true}; ")

[C #]

txtLongText.Attributes.Add("onkeydown", 
"if(event.which || event.keyCode){if ((event.which == 9)" +
"|| (event.keyCode == 9)) {document.getElementById('"+
txtLongText.ClientID + "').selection = document.selection.createRange();" + 
txtLongText.ClientID + ".selection.text = String.fromCharCode(9);return false;}} else {return true}; ");

Ou mieux, pour éviter un codage difficile, vous pouvez mettre ce code dans une fonction nommée EnableTabType. La fonction a un seul paramètre, qui spécifie quel TextBoxcontrôle est nécessaire pour permettre la saisie de caractères de tabulation.

[VB.NET]

Public Sub EnableTabType(tb As TextBox)
    tb.Attributes.Add("onkeydown", _
    "if(event.which || event.keyCode){if((event.which == 9)" & _ 
    "|| (event.keyCode == 9)) {document.getElementById('" & _ 
    tb.ClientID & "').selection=document.selection.createRange();" & _
    tb.ClientID & ".selection.text = " & _
    " String.fromCharCode(9);return false;}}else{return true};")
End Sub 

[C #]

public void EnableTabType(TextBox tb)
{ 
    tb.Attributes.Add("onkeydown", 
    "if(event.which || event.keyCode){if ((event.which == 9)" +
    "|| (event.keyCode == 9)) {document.getElementById('"+
    tb.ClientID + "').selection = document.selection.createRange();" +
    tb.ClientID + ".selection.text = String.fromCharCode(9);return false;}} else {return true}; ");
}

Source: http://www.beansoftware.com/ASP.NET-Tutorials/Access-Tab-Key.aspx

ou en utilisant ahk pour insérer 4 * espace dans l'éditeur:

^Right::
tabspace:="    "
send,%tabspace%    
return 

vous pouvez voir les détails du code explaintation dans le code ahk