Forum |  HardWare.fr | News | Articles | PC | S'identifier | S'inscrire | Shop Recherche
1531 connectés 

  FORUM HardWare.fr
  Programmation
  Javascript/Node.js

  Récupérer le contenu d'un input text

 


 Mot :   Pseudo :  
 
Bas de page
Auteur Sujet :

Récupérer le contenu d'un input text

n°2313405
iamlouky
Posté le 31-03-2018 à 10:33:30  profilanswer
 

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.
 

Code :
  1. <div id="gauche">
  2.    <span class="copy"></span>
  3. </div>
  4.  
  5. <div id="droite">
  6.    <p class="label1">Texte du label <input type="text" name="txt" id="txt"><button class="button2">OK</button></p>
  7. </div>

mood
Publicité
Posté le 31-03-2018 à 10:33:30  profilanswer
 

n°2313406
rufo
Pas me confondre avec Lycos!
Posté le 31-03-2018 à 11:01:43  profilanswer
 

Pas besoin de jquery pour faire un truc aussi simple mais au préalable, rajoute un id à ton span (ex : mySpan) , ça facilitera les choses :
var sTxt = document.getElementById('txt').value;
document.getElementById('mySpan').innerHTML = sTxt;
 
Edit : un conseil : avant d'apprendre une lib de haut niveau, apprends d'abord le langage lui-même. Ca te permettra de voir ce qu'apporte réellement jquery par rapport aux fonctions de base du javascript et t'en servir quand c'est vraiment nécessaire :o


Message édité par rufo le 31-03-2018 à 11:03:22

---------------
Astres, outil de help-desk GPL : http://sourceforge.net/projects/astres, ICARE, gestion de conf : http://sourceforge.net/projects/icare, Outil Planeta Calandreta : https://framalibre.org/content/planeta-calandreta
n°2313408
pjulienne
Posté le 31-03-2018 à 12:10:31  profilanswer
 

iamlouky a écrit :

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.
 

Code :
  1. <div id="gauche">
  2.    <span class="copy"></span>
  3. </div>
  4.  
  5. <div id="droite">
  6.    <p class="label1">Texte du label <input type="text" name="txt" id="txt"><button class="button2">OK</button></p>
  7. </div>



 
Bonjour  
Voici le code qui vous permet d'afficher le contenu d'input  

Code :
  1. <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
  2. <script type="text/javascript">
  3. $(function() {
  4.   $('#txt').on("input", function() {
  5.     $('#someDiv').text($(this).val());
  6.   });
  7. });
  8. </script>
  9. <div id="someDiv"></div>
  10.     <div id="gauche">
  11.        <span class="copy"></span>
  12.     </div>
  13.    
  14.     <div id="droite">
  15.        <p class="label1">Texte du label <input type="text" name="txt" id="txt"><button class="button2">OK</button></p>
  16.     </div>
  17. <div id="someDiv"></div>


---------------
Comment regarder la TV sans le câble ?  https://how-to.watch/fr/tv-sans-cable/
n°2313409
iamlouky
Posté le 31-03-2018 à 12:29:15  profilanswer
 

pjulienne a écrit :


 
Bonjour  
Voici le code qui vous permet d'afficher le contenu d'input  

Code :
  1. <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
  2. <script type="text/javascript">
  3. $(function() {
  4.   $('#txt').on("input", function() {
  5.     $('#someDiv').text($(this).val());
  6.   });
  7. });
  8. </script>
  9. <div id="someDiv"></div>
  10.     <div id="gauche">
  11.        <span class="copy"></span>
  12.     </div>
  13.    
  14.     <div id="droite">
  15.        <p class="label1">Texte du label <input type="text" name="txt" id="txt"><button class="button2">OK</button></p>
  16.     </div>
  17. <div id="someDiv"></div>



 
 
Merci pour votre réponse. Le code marche correctement mais ce n'est pas exactement ce que je veux. J'aimerais que lorsqu'on tape le texte dans l'input que ça soit validé d'abord (cliqué sur le bouton OK) avant que cela ne soit affiché dans le <div id="someDiv"></div>.

n°2313411
rufo
Pas me confondre avec Lycos!
Posté le 31-03-2018 à 13:34:00  profilanswer
 

Tu appelles la fonction sur l'événement onclick du bouton.


---------------
Astres, outil de help-desk GPL : http://sourceforge.net/projects/astres, ICARE, gestion de conf : http://sourceforge.net/projects/icare, Outil Planeta Calandreta : https://framalibre.org/content/planeta-calandreta

Aller à :
Ajouter une réponse
  FORUM HardWare.fr
  Programmation
  Javascript/Node.js

  Récupérer le contenu d'un input text

 

Sujets relatifs
Gestionnaire de contenu moderne [PHP, SQL] Forum de discussionProgramme simple pour récupérer informations système d'une machine lin
récupérer collection d'objets en PHP depuis une D.B.problème avec variable à contenu "complexe"
Récupérer date et heure de modification de dossier dans FTPAfficher le contenu d'une ligne de la bdd
Deplacer le contenu d'un repertoire vers son parent[VBA Excel] Recuperer une couleur mise en forme par condition
[Ajax] Récupèrer l'action lors d'événement après rechargement de pageReset plusieurs textbox.text sur la même page.
Plus de sujets relatifs à : Récupérer le contenu d'un input text


Copyright © 1997-2022 Hardware.fr SARL (Signaler un contenu illicite / Données personnelles) / Groupe LDLC / Shop HFR