Champ texte + conditions
ThOleS2
Messages postés
18
Date d'inscription
Statut
Membre
Dernière intervention
-
Utilisateur anonyme -
Utilisateur anonyme -
Bonjour,
Je suis en train de construire un petit site internet, et j'aimerais savoir s'il est possible de créer un champ où en validant le mot entré dans le champ, le cadre du champ change de couleur en vert si le mot entré est bon ou en rouge si le mot entré est faux.
Par exemple ; si le mot à trouver est "bouée", faire une condition en rentrant des mots clés :
Si dans le champ il y a écrit "bouée, boué, bouee, boue, bwé", alors le champ texte s'encadre de vert, sinon le champ texte s'encadre de rouge.
Je recherche donc un code html pour créer ce champ.
J'espère avoir bien expliqué ce que je recherche :)
Merci à vous !
Je suis en train de construire un petit site internet, et j'aimerais savoir s'il est possible de créer un champ où en validant le mot entré dans le champ, le cadre du champ change de couleur en vert si le mot entré est bon ou en rouge si le mot entré est faux.
Par exemple ; si le mot à trouver est "bouée", faire une condition en rentrant des mots clés :
Si dans le champ il y a écrit "bouée, boué, bouee, boue, bwé", alors le champ texte s'encadre de vert, sinon le champ texte s'encadre de rouge.
Je recherche donc un code html pour créer ce champ.
J'espère avoir bien expliqué ce que je recherche :)
Merci à vous !
A voir également:
- Champ texte + conditions
- Excel cellule couleur si condition texte - Guide
- Texte de chanson gratuit pdf - Télécharger - Vie quotidienne
- Transcription audio en texte word gratuit - Guide
- Texte barré whatsapp - Guide
- Mettre un texte en majuscule - Guide
13 réponses
le mot est boué
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>test</title>
<style type="text/css">
</style>
</head>
<body>
<form id="form">
<input type="text" id="word" />
<br />
<input type="submit" value="soumettre" />
</form>
<script type="text/javascript">
function submit() {
var word = document.getElementById("word");
var just = "boué";
if(word.value == just) {
word.style.backgroundColor = "green";
} else {
word.style.backgroundColor = "red";
}
}
var form = document.getElementById("form");
form.addEventListener("submit", function(e) {
submit();
e.preventDefault();
}, true);
</script>
</body>
</html>
J'ai trouvé un bon exemple :
Sur https://whatthemovie.com/ le but est de trouer le titre d'un film ; quand vous entrez le nom du film la cadre se met en vert, et quand vous vous trompez, le cadre se met en rouge.
Merci :)
Sur https://whatthemovie.com/ le but est de trouer le titre d'un film ; quand vous entrez le nom du film la cadre se met en vert, et quand vous vous trompez, le cadre se met en rouge.
Merci :)
Super, merci beaucoup !!!
Par contre quand je rentre "boué" et que je fais "soumettre" la page se recharge puis je ne vois pas si le mot était bon ou mauvais. Est-ce qu'il n'est pas possible de voir la réponse directement après avoir soumit mon mot clé sans que la page ne se recharge ?
Par contre quand je rentre "boué" et que je fais "soumettre" la page se recharge puis je ne vois pas si le mot était bon ou mauvais. Est-ce qu'il n'est pas possible de voir la réponse directement après avoir soumit mon mot clé sans que la page ne se recharge ?
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question
Ben je comprend pas normalement la ligne
Quel navigateur utilisé vous?
e.preventDefault();sert justement à cela et chez moi la page ne se charge pas et mot reste affiché
Quel navigateur utilisé vous?
Ah non je sais ;
J'utilise Joomla sur Firefox, et quand je retourne pour modifier mon code il n'y a plus que ces lignes :
Du coup ce n'est plus un problème avec le code que j'ai, mais avec Joomla...
J'utilise Joomla sur Firefox, et quand je retourne pour modifier mon code il n'y a plus que ces lignes :
<p>test</p> <form id="form"><input id="word" type="text" /> <br /> <input type="submit" value="soumettre" /></form>
Du coup ce n'est plus un problème avec le code que j'ai, mais avec Joomla...
C'est bon j'ai trouvé ! Si ça intéresse quelqu'un pour plus tard :
Dans Joomla, il faut aller dans "Configuration" puis changer la ligne"Éditeur par défaut" où il y a écrit "Éditeur - TinyMCE" qu'il faut remplacer par "Éditeur - Non WYSIWYGe".
Voilà, encore merci à lobotoFix !!!
Dans Joomla, il faut aller dans "Configuration" puis changer la ligne"Éditeur par défaut" où il y a écrit "Éditeur - TinyMCE" qu'il faut remplacer par "Éditeur - Non WYSIWYGe".
Voilà, encore merci à lobotoFix !!!
En plus de
Je ne sais pas si les accents et majuscules comptent par contre.
var just = "boué";il faudrait "bouée", "bwé".
Je ne sais pas si les accents et majuscules comptent par contre.
function submit() {
var word = document.getElementById("word");
if(word.value=="boué"||word.value=="bouée"||word.value=="bwé") {
word.style.backgroundColor = "green";
} else {
word.style.backgroundColor = "red";
}
}
var form = document.getElementById("form");
form.addEventListener("submit", function(e) {
submit();
e.preventDefault();
}, true);
