Récupérer le contenu d'un input text [Fermé]

Signaler
Messages postés
14
Date d'inscription
mardi 26 décembre 2017
Statut
Membre
Dernière intervention
22 avril 2018
-
jordane45
Messages postés
28009
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
2 avril 2020
-
Bonjour,

Je viens de débuter avec Jquery, j'aimerais que lorsque je tape quelque chose dans l'input et que je clique sur OK, que le texte tapé s'affiche dans le span et que l'input disparaît automatiquement.

Merci pour votre aide.

<div id="gauche">
    <span class="copy"></span>
</div>
 
<div id="droite">
    <p class="label1">Texte du label <input type="text" name="txt" id="txt"><button class="button2">OK</button></p>
</div>

1 réponse

Messages postés
28009
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
2 avril 2020
2 230
Bonjour,


Je viens de débuter avec Jquery,

Parfait. Montre nous ce que tu as essayé de faire afin qu'on puisse t'aider à corriger.

Sachant que tu peux utiliser les méthodes hide() et show() pour afficher/masquer tes champs.
Et que pour lire le contenu d'un input il faut utiliser la méthode .val() et pour écrire dans un span .html()
iamlouky
Messages postés
14
Date d'inscription
mardi 26 décembre 2017
Statut
Membre
Dernière intervention
22 avril 2018

Voila mon code, lorsqu'on clique sur le bouton Label cela affiche un input. Maintenant j'aimerais que lorsqu'on tape un texte dans cet input que cela s'affiche dans le span.
<span class="copy"></span>



<!DOCTYPE html>
<html>
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

  <style>
  body {
    margin: 0;
  }
  #gauche {
    float: left;
    width: 70%;
    height: 1000px;
    background-color: #EFECCA;
  }
  #droite {
    background-color: #CEFFF8;
    height: 1000px;
    padding : 10px;
    padding-left: 71%;
  }
</style>
</head>
<body>
  <div id="gauche">
<span class="copy"></span>
  </div>
  <div id="droite">
    Formulaire<br><br>
    <button class="button1">Label</button>
    <button>Zone de texte</button>
    <button>Bouton</button>
    <p class="label1">Texte du label <input type="text" name="nom"><button>OK</button></p>
  </div>
  
  <script src="jquery.js"></script>
  <script type="text/javascript">
    $(document).ready(function(){
    $(".button1").click(function(){
        $(".label1").fadeIn();
    });
});

    $(function() {
        $('.label1').hide();
      }); 
  </script>
</body>
</html>body>
</html>
jordane45
Messages postés
28009
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
2 avril 2020
2 230
ben.. comme je te l'ai dit...
Pour lire le contenu de ton imput :
var txt = $("#txt").val();

Pour écrire dans le span
$(".copy").html(txt);