Aide code HTML tout simple

Résolu/Fermé

Didou97350 - Modifié le 12 janv. 2021 à 21:24
Didou97350 - 12 janv. 2021 à 23:06

Bonsoir à tous !

Je viens à vous car je m'arrache les cheveux depuis 3 bonnes heures, et ai effectué déjà pas mal de recherche... en vain...

(Je suis 95% novice en HTML).

L'idée est de faire une page avec 3 "mots de passes" prédéfinis à l'avance dans le code. Une entrée de texte, ainsi qu'un bouton de validation sont présent sur celle-ci.

Dès lors qu'un des 3 mots est rentré, puis validé via le bouton, nous sommes redirigé vers une page web prédéfinie.

Ci-dessous mon code (qui risque de vous faire marrer :lol:) :

 

<form>

    <div>
    
    <input type="text" name="Enter_the_word" id="test" placeholder="Enter_the_word" required><br>

      <br>

      <button type="submit" style="background-color: blue; color: yellow" onclick="myFunction()">VALIDER</button>
         
    </div>

  <head>
  
    <script>
    
      function myFunction(){
        if (document.getElementById("test").value != "mot1") {
        
        location.href = "https://www.exemple1.com/";
                 
        } else if (document.getElementById("test").value == "mot2") {
          location.href = "https://www.exemple2.com/";
                   
        }  else if (document.getElementById("test").value == "mot3") {
          location.href = "https://www.exemple3.com/";
        }
        
      }
    </script>

</head>

</form>

Je vous remercie d'avance pour l'aide apportée ! :)

A voir également:

Aide code HTML tout simple
Code asci - Guide
Code puk bloqué - Guide
Editeur html - Télécharger - HTML
Code telephone oublié - Guide
Code activation windows 10 - Guide

3 réponses

Réponse 1 / 3

jordane45 Messages postés 38299 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 20 novembre 2024 4 704
Modifié le 12 janv. 2021 à 21:30

Bonjour,

NOT EQUAL ( != ) ?

if (document.getElementById("test").value != "mot1") {

A mon avis.. c'est

if (document.getElementById("test").value == "mot1") {

PS: ta question concerne du javascript ... pas du html
je déplace donc dans le forum JS

PS²: Ton code pourrais s'acrire plus "proprement" comme ceci

function myFunction(){
  var testValue = document.getElementById("test").value;
  var redirectTo = "";
  switch(testValue){
    case "mot1":
      redirectTo = "https://www.exemple1.com/";
      break;
    case "mot2":
      redirectTo = "https://www.exemple2.com/";
      break;
    case "mot3":
      redirectTo = "https://www.exemple3.com/";
      break;
    default: // si aucun des mots ...
      return false;
      break;
  }
  location.href = redirectTo; 
}

Réponse 2 / 3

Didou97350
Modifié le 12 janv. 2021 à 22:26

Bonsoir, merci pour la réponse !

Alors je viens de tester, mais même problème, j'ai un message m'informant l'erreur 404 : Page not found, quelque soit ce que je tape dans l'entrée de texte...

Mon code mis à jour :


<form>

    <div>
    
    <input type="text" name="Enter_the_word" id="test" placeholder="Enter_the_word" required><br>

      <br>

      <button type="submit" style="background-color: blue; color: yellow" onclick="myFunction()">VALIDER</button>
         
    </div>

  <head>
  
    <script>
    
      function myFunction(){
  var testValue = document.getElementById("test").value;
  var redirectTo = "";
  switch(testValue){
    case "mot1":
      redirectTo = "https://www.exemple1.com/";
      break;
    case "mot2":
      redirectTo = "https://www.exemple2.com/";
      break;
    case "mot3":
      redirectTo = "https://www.exemple3.com/";
      break;
    default: // si aucun des mots ...
      return false;
      break;
  }
  location.href = redirectTo; 
  
  
}
    </script>

</head>

</form>

Je commence réellement à sécher..

EDIT : Correction des balises de code.... encore !!

jordane45 Messages postés 38299 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 20 novembre 2024 4 704
12 janv. 2021 à 22:25

Ben, lorsque tu as ton 404 .. tu as quoi comme adresse au niveau de l'url de ton navigateur ?

par ce que je doute que les sites exemple1 2 et 3 ... existent....
Donc c'est un peu normal qu'il ne les trouve pas non ?

Ah, et aussi, change le "type" de ton bouton ... en button et non en submit

 <button type="button"  name="Enter_the_word" id="test" placeholder="Enter_the_word" required><br>

jordane45 Messages postés 38299 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 20 novembre 2024 4 704 > jordane45 Messages postés 38299 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 20 novembre 2024
12 janv. 2021 à 22:30

Ton code html est foireux également....
comment peux tu avoir des balises <head> après du html ....?

<!Doctype>
<html>
  <head>
    <title>TEST</title>
     <meta charset="utf-8">
   </head>
   <body>
     <form>
       <div>
         <input type="text" name="Enter_the_word" id="test" placeholder="Enter_the_word" required><br>
         <br>
         <button type="button" style="background-color: blue; color: yellow" onclick="myFunction()">VALIDER</button>
       </div>
     </form>

    <!-- Toujours placer le JS avant le </body> ... après tout ton html !! -->
    <script>
      function myFunction(){
        var testValue = document.getElementById("test").value;
        var redirectTo = "";
        switch(testValue){
          case "mot1":
            redirectTo = "https://www.exemple1.com/";
            break;
          case "mot2":
            redirectTo = "https://www.exemple2.com/";
            break;
          case "mot3":
            redirectTo = "https://www.exemple3.com/";
            break;
          default: // si aucun des mots ...
            return false;
            break;
        }
        location.href = redirectTo; 
      }
    </script>
   </body>
</html>

Dernière petite chose, pour les prochains codes que tu posteras sur le forum ... il faut, dans les balises de code, préciser le langage afin d'avoir la coloration syntaxique
Explications (à lire ENTIEREMENT !! ) disponibles ici : https://codes-sources.commentcamarche.net/faq/11288-les-balises-de-code

Réponse 3 / 3

Didou97350
12 janv. 2021 à 23:06

Je viens de tester ton code, et celui-ci fonctionne à merveille, un grand merci pour ton aide !

Je prend note, je me dirige vers ton lien.

Bonne soirée,

Discussions similaires

code ascii

Code de renvoi d'appel : Ooredo, Mobilis...

code d'activation GTA 5 steam

Codes bateaux et avion GTA vice city Stories