Interdire de taper quelques caractères, par exemple ' <', '> 'dans toutes les zones de texte d'entrée en utilisant jquery

Question

Comment puis-je obtenir ceci: -
Lorsque les types d'utilisateurs personnage comme 'abcd' puis '>' (un caractère non valide pour ma demande), je veux mettre le texte à 'abcd'. Mieux si nous pouvons annuler l'entrée elle-même comme nous le faisons dans l'application winforms. Cela devrait se produire lorsque l'utilisateur tape et pas sur un clic de bouton.

Je veux que cela s'applique à toutes les zones de texte de ma page Web. Ce sera facile si la solution est basée sur jQuery. Peut être quelque chose qui va commencer comme ça.
$("input[type='text']")

SOLUTION
J'utilisé à la fois de la réponse fournie par @jAndy et @Iacopo (Désolé, ne pouvait pas marquer comme réponse à la fois) comme ci-dessous.

$(document).ready(function() { 
    //makes sure that user cannot enter <or> sign in text boxes. 
    $("input:text").keyup(purgeInvalidChars) 
     .blur(purgeInvalidChars) 
     .bind('keypress', function(event) { 
     if (event.which === 62 || event.which === 60) 
      return (false); 
     }); 
    function purgeInvalidChars() { 
    if (this.value != this.value.replace(/[<>]/g, '')) { 
     this.value = this.value.replace(/[<>]/g, ''); 
    } 
    } 
}); 

Bien qu'un problème restait encore à-dire qu'il ne permet pas à l'utilisateur de sélectionner du texte dans la zone de texte et cela ne se produit que sur le chrome, fonctionne très bien sur IE (pour la première fois: D), non testé sur Firefox. Il serait heureux si quelqu'un peut trouver une solution pour cela ou espère que les gens de Google le résout: D.

MISE À JOUR
Je l'ai résolu par chèque if (this.value != this.value.replace(/[<>]/g, '')). Solution également mise à jour.

Merci encore à tous les répondeurs.

Answer 1

Vous devriez attraper les événements 'keyup' et 'flou' et les attacher à une fonction qui bonifie l'entrée: ne pas oublier que l'utilisateur peut coller une séquence de caractères invalide.

Ainsi, par exemple

$('input[type="text"]').keyup(purgeInvalidChars).blur(purgeInvalidChars) 

function purgeInvalidChars() 
{ 
    this.value = this.value.replace(/[<>]/g, ''); 
} 

sûrement vous permettra d'améliorer l'expression régulière, peut-être en remplaçant tous les caractères sauf ceux activés.

Désolé, je ne peux pas tester mon code, vous devez donc prendre cum grano salis :-)

Answer 2

Exemple (keypress):

$(document).ready(function(){ 
    $('input:text').bind('keypress', function(event){ 

    if(event.which === 62 || event.which === 60) 
     return(false); 
    }); 
});​ 

Exemple (keydown):

$(document).ready(function(){ 
    $('input:text').bind('keydown', function(event){ 
    if(event.which === 226) 
     return(false); 
    }); 
});​ 

Juste utilisent des fonctions preventDefault et stopPropagation pour les événements. Ceux-ci sont déclenchés en retournant (false) dans un gestionnaire d'événements.

Dans cet exemple, je vérifie simplement le code clé de < et > qui est heureusement sur la même clé. Si nous frappons ce code, nous empêchons simplement le comportement par défaut.

Référence: .preventDefault(), .stopPropagation()

Answer 3

$('#textBox').keyup(function(e){ 
      var myText = $('#textBox').val(); 
      myText = myText.replace(">", ""); 
      myText = myText.replace("<", ""); 
      $('#textBox').val(myText); 
     }); 

- Mise à jour -

à la place keyupkeypress