web-dev-qa-db-fra.com

Comment faire en sorte que tout dans un champ de texte soit en lettres majuscules/majuscules?

Je veux que tout ce que j'écris dans un champ de texte soit en majuscule. Au moment où j'écris, pas après avoir perdu ma concentration.

Comment est-ce que je fais ceci en utilisant jQuery?

21
randomizertech

Je voudrais utiliser CSS pour cela.

Ajoutez simplement text-transform: uppercase à votre style, puis sur le côté serveur, vous pouvez le convertir en majuscule.

input {
  text-transform: uppercase;
}
66
Brandon
$('input[type=text]').keyup(function() {
    $(this).val($(this).val().toUpperCase());
});
14
Gazler

Utilisation
oninput='this.value=this.value.toUpperCase();
Cet événement ne concerne que de tels cas. Il est déclenché après la saisie de l'utilisateur (en appuyant sur la touche) mais avant la mise à jour (affichage de la valeur). utiliser uniquement le style pour modifier l’affichage sans modifier les données réelles).

5
Cpt Balu

Vous devrez peut-être utiliser une combinaison de ceux-ci.

l'utilisation du style de transformation de texte rend le type en majuscule, bien que la valeur puisse être en minuscule.

Le javascript ne changera le texte actuel en haut qu'une fois le champ modifié ou le focus perdu.

vous pouvez utiliser jquery de gazler ou simplement javascript en ligne 

par exemple. onblur = 'javascript: this.value = this.value.toUpperCase ();'

Cela signifie que la valeur du texte apparaîtra en majuscule et qu’elle le sera réellement lorsque la valeur changera ou que le contrôle perdra le focus.

HTH Sam

1
sambomartin

Pour construire sur la réponse de @ Gazler, une solution améliorée qui gère mieux les touches de modification (en supposant que vous ayez un espace réservé de casse mixte et que vous ne pouvez pas définir text-transform: uppercase;):

$('.search-input input[type=text]').keyup(function() {
    var v = $(this).val();
    var u = v.toUpperCase();
    if( v != u ) $(this).val( u );
})
0
sean2078