Supprimer voyelles et espaces dans une <input> [Résolu]

Question

Posez votre question Signaler

Supprimer voyelles et espaces dans une <input> [Résolu]

Tri4L

Messages postés: 9
Date d'inscription: mardi 3 avril 2018
Statut: Membre
Dernière intervention: 20 avril 2018

- Modifié le 3 avril 2018 à 13:53 - Dernière réponse : BunoCS

Messages postés: 14636
Date d'inscription: lundi 11 juillet 2005
Statut: Modérateur
Dernière intervention: 9 octobre 2019

- 3 avril 2018 à 16:13

Javascript / DHTML Posez votre question Signaler

Bonjour,
je souhaite pour un travail de recherche, trouver de l'aide pour un script qui peut m'aider à supprimer toutes les voyelles (a,e,i,u,o,y) puis espaces vides dans une <input> après appui sur un bouton. Donc si par exemple je rentre "azertyuiop" dans le <input>, le résultat après click sur le bouton deviens "zrtp". J'ai des connaissances en html / css mais alors en javascript je suis une vrai quiche pour l'instant...
Admettons:

<html>
    <head>
        <title></title>
 
        <script type="text/javascript">
        </script>

    </head>
    <body>

        <input id="inputbox01" width="50px;">
        <input type="button" value="Enlever voyelles" onclick="" />

    </body>
</html>

Je remercie les éventuels codeurs de vôtre aide!

EDIT : Ajout des balises de code (la coloration syntaxique).
Explications disponibles ICI

Merci d'y penser dans tes prochains messages.

Afficher la suite

A voir également:

Supprimer un caractère d'une chaine javascript
Supprimer espace javascript - Meilleures réponses
Javascript supprimer espace - Meilleures réponses
SUPPRIMER LES CARACTERES D'UNE CHAINE ✓ - Forum - C++ & C++ .NET
Supprimer un caractère d'une chaîne ✓ - Forum - Visual Basic 6
Supprimer des caractères dans une chaine ✓ - Forum - C# / .NET
Supprimer un caractere d'une chaine de maniere aleatoire... ✓ - Forum - Javascript / DHTML
Javascript : Calcul de la taille en pixel d'une chaine de caractère avec java et javascript - - Guide

3 réponses

Signaler Commenter la réponse de BunoCS

BunoCS

Messages postés: 14636
Date d'inscription: lundi 11 juillet 2005
Statut: Modérateur
Dernière intervention: 9 octobre 2019

90 3 avril 2018 à 14:35

1

Merci

Il te faut quelques bases en Javascript, oui: variables et fonctions.
Ensuite, il faudra répondre à la question suivante: "comment récupérer le contenu d'un input ?"
Puis, celle-ci: "comment supprimer des caractères d'une chaine de caractère ?"
Et enfin: "que faire avec le résultat ?"

Pour répondre aux 2 premières questions, quelques petites recherches rapides t'aideront. Pour la dernière, à toi d'y répondre ;)

Dire « Merci » 1

Quelques mots de remerciements seront grandement appréciés. Ajouter un commentaire

Codes Sources 190 internautes nous ont dit merci ce mois-ci

Signaler Commenter la réponse de Tri4L

Tri4L

Messages postés: 9
Date d'inscription: mardi 3 avril 2018
Statut: Membre
Dernière intervention: 20 avril 2018

Modifié le 3 avril 2018 à 16:09

0

Merci

Ok, ensuite j'utilise la méthode "replace()" pour répondre a l'étapes suivantes cad, "comment supprimer des caractères d'une chaine de caractère ?" Le résultat est immédiat dans le <input> :

<html>
<head>
<title></title>

<script type="text/javascript">
function mafonction()
{
var mavariable = document.getElementById("inputbox01").value;
var res = mavariable.replace("a", "");                            
 document.getElementById("inputbox01").value = res;
}
</script>

</head>
<body>
<input type="text" id="inputbox01" width="50px;">
<input type="button" value="Enlever voyelles" onclick="mafonction()" />
</body>
</html>

Afficher les 6 commentaires

Signaler Commenter la réponse de Tri4L

Tri4L

Messages postés: 9
Date d'inscription: mardi 3 avril 2018
Statut: Membre
Dernière intervention: 20 avril 2018

- Modifié le 3 avril 2018 à 16:09

Au passage je rajoute un bouton effacer ce qui donne:

<html>
  <head>
    <title></title>
    <script type="text/javascript">
function mafonction()
{
var mavariable = document.getElementById("inputbox01").value;
var res = mavariable.replace(/a/g, "");
document.getElementById("inputbox01").value = res;
}
 function effacer()
{
 document.getElementById("inputbox01").value="";
}
</script>
  </head>
  <body>
    <input type="text" id="inputbox01" width="50px;">
    <input type="button" value="Enlever voyelles" onclick="mafonction()" />
    <input type="button" value="Effacer" onclick="effacer()" />
  </body>
</html>

Signaler Commenter la réponse de Tri4L

Tri4L

Messages postés: 9
Date d'inscription: mardi 3 avril 2018
Statut: Membre
Dernière intervention: 20 avril 2018

- 3 avril 2018 à 15:53

Bon c'est là que je bloque:
Cette ligne supprime tous les "a" --> var res = mavariable.replace(/a/g,"");
Comment rajouter la suppression des autres lettres: e,u,i,y?

Signaler Commenter la réponse de BunoCS

BunoCS

Messages postés: 14636
Date d'inscription: lundi 11 juillet 2005
Statut: Modérateur
Dernière intervention: 9 octobre 2019

90 - Modifié le 3 avril 2018 à 16:10

Soit tu fais une boucle pour chaque lettre à supprimer, soit tu utilises des expressions régulières.

Note: fais attention à bien rajouter les balises code (cf. ta question que j'ai modifiée)

Signaler Commenter la réponse de Tri4L

Tri4L

Messages postés: 9
Date d'inscription: mardi 3 avril 2018
Statut: Membre
Dernière intervention: 20 avril 2018

- Modifié le 3 avril 2018 à 16:12

Ok trouvé, donc voici le code final:

<html>
  <head>
    <title></title>
    <script type="text/javascript">
function mafonction()
{
var mavariable = document.getElementById("inputbox01").value;
var res = mavariable.replace(/a|e|i|o|u|y/g, "");

document.getElementById("inputbox01").value = res;
}
 function effacer()
{
 document.getElementById("inputbox01").value="";
}
</script>
  </head>
  <body>
   
   <input type="text" id="inputbox01" style="width: 50px;" >
    <input type="button" value="Code nostradamus" onclick="mafonction()" />
 <input type="button" value="Effacer" onclick="effacer()" />
  </body>
</html>

Vous devez vous demander l'utilité de ce script je pari!

Signaler Commenter la réponse de BunoCS

BunoCS

Messages postés: 14636
Date d'inscription: lundi 11 juillet 2005
Statut: Modérateur
Dernière intervention: 9 octobre 2019

90 - 3 avril 2018 à 16:13

Bien joué!
Si ton problème est résolu, merci de passer le topic en résolu (tout en haut, roue crantée,...)

Répondre Posez votre question

Seulement ce paramètre ("a", "") ne supprime (remplace par rien) que un seul "a" dans le <input> donc si j'en ai plusieurs je dois appuyer plusieurs fois sur le bouton donc je modifie:

var res = mavariable.replace("a", "");
par
var res = mavariable.replace(/a/g,"");

ce qui enlève tous les "a" en un seul click sur le bouton. Test ok.
Par contre je galère pour rajouter les autres lettres à supprimer en même temps (e,u,i,o,y,) ça doit surement être une syntaxe super simple (quand on la connais :) Je sais que c'est là dedans que sa se passe: (/a/g,"")
Au passage je rajoute un bouton effacer ce qui donne:

<html> <head> <title></title> <script type="text/javascript"> function mafonction() { var mavariable = document.getElementById("inputbox01").value; var res = mavariable.replace(/a/g, ""); document.getElementById("inputbox01").value = res; } function effacer() { document.getElementById("inputbox01").value=""; } </script> </head> <body> <input type="text" id="inputbox01" width="50px;"> <input type="button" value="Enlever voyelles" onclick="mafonction()" /> <input type="button" value="Effacer" onclick="effacer()" /> </body> </html>
Bon c'est là que je bloque:
Cette ligne supprime tous les "a" --> var res = mavariable.replace(/a/g,"");
Comment rajouter la suppression des autres lettres: e,u,i,y?
Soit tu fais une boucle pour chaque lettre à supprimer, soit tu utilises des expressions régulières.

Note: fais attention à bien rajouter les balises code (cf. ta question que j'ai modifiée)
Ok trouvé, donc voici le code final:

<html> <head> <title></title> <script type="text/javascript"> function mafonction() { var mavariable = document.getElementById("inputbox01").value; var res = mavariable.replace(/a|e|i|o|u|y/g, ""); document.getElementById("inputbox01").value = res; } function effacer() { document.getElementById("inputbox01").value=""; } </script> </head> <body> <input type="text" id="inputbox01" style="width: 50px;" > <input type="button" value="Code nostradamus" onclick="mafonction()" /> <input type="button" value="Effacer" onclick="effacer()" /> </body> </html>

Vous devez vous demander l'utilité de ce script je pari!
Bien joué!
Si ton problème est résolu, merci de passer le topic en résolu (tout en haut, roue crantée,...)

BunoCS · Accepted Answer · 2018-04-03T13:53:56+0200

Meilleure réponse

Signaler Commenter la réponse de BunoCS

BunoCS

Messages postés: 14636
Date d'inscription: lundi 11 juillet 2005
Statut: Modérateur
Dernière intervention: 9 octobre 2019

90 3 avril 2018 à 13:53

1

Merci

Bonjour,

Alors, t'aider, oui, ça doit être faisable. Par contre, faire le travail à ta place, non ;)

Dire « Merci » 1

Quelques mots de remerciements seront grandement appréciés. Ajouter un commentaire

Codes Sources 190 internautes nous ont dit merci ce mois-ci

Signaler Commenter la réponse de Tri4L

Tri4L

Messages postés: 9
Date d'inscription: mardi 3 avril 2018
Statut: Membre
Dernière intervention: 20 avril 2018

- Modifié le 3 avril 2018 à 16:09

Merci BunoCS de ta réponse, je comprends. Je n'y connais rien mais j'imagine que la première étape est de créer une variable (ou fonction?) qui récupère le contenu de "l'input".
Genre quelque chose comme ça:
Je créer une fonction que je nomme "mafonction", dans celle-ci je créer une variable que j'associe au contenu de l'input (id="inputbox01").
Je paramètre mon bouton pour lancer "mafonction" lors du click.
Mon raisonnement est t'il correct jusque-là? (Ceci est mon tout premier script!)

<html>
    <head>
        <title></title>
 
        <script type="text/javascript">
            function mafonction()
        {
            var mavariable = document.getElementById("inputbox01").value;
            ...
        }   
        </script>
    </head>
    <body>

        <input type="text" id="inputbox01" width="50px;">
        <input type="button" value="Enlever voyelles" onclick="mafonction()" />

    </body>
</html>

Supprimer voyelles et espaces dans une <input> [Résolu]

Votre réponse