Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

132
Vistas
¿Cómo guardo y muestro la entrada de texto en el almacenamiento local usando un botón?

Así que estoy tratando de guardar el valor de las entradas de texto en el almacenamiento local después de que un usuario lo ingrese usando un botón. Una vez que lo guardan, hacen clic en otro botón para mostrar el contenido del almacenamiento local en otra área de texto. He probado todos los métodos que se me ocurrieron. Gracias por adelantado.

 <script> function add_local(){ window.localStorage['display'] = document.getElementById('firstname').value; window.localStorage['display']= document.getElementById('age').value; window.localStorage['display']= document.getElementById('course').value; } function show_local(){ document.getElementById('firstname').value = window.localStorage['display']; document.getElementById('age').value = window.localStorage['display']; document.getElementById('course').value = window.localStorage['display']; } </script>
 <input type="text" id="firstname" /><br /><br /> <label for="age">Age</label><br /> <input type="text" id="age" /><br /><br /> <label for="course">Favorite Course</label><br /> <input type="text" id="course" /><br /> </div> <div class="right"> <input type="button" value="Add to localStorage" onclick="add_local()" /> <input type="button" value="Add to sessionStorage" /> <input type="button" value="Show localStorage" onclick="show_local()"/> <input type="button" value="Show sessionStorage" /> </div> </div> <div class="display"> <label for="display">Display</label><br> <textarea id="display" name="display" rows="10" ></textarea> </div> </div> </body>

about 4 years ago · Juan Pablo Isaza
3 Respuestas
Responde la pregunta

0

en el almacenamiento local tiene un método para configurar y obtener

https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage

me gusta

 localStorage.setItem('myCat', 'Tom'); const cat = localStorage.getItem('myCat');

con ese método guardas en localStorage

about 4 years ago · Juan Pablo Isaza Denunciar

0

Hiciste casi todo bien. Simplemente reemplace el siguiente código JS con su js. Acaba de reemplazar sus datos de almacenamiento antiguos mientras los asignaba con uno nuevo.

 function add_local() { window.localStorage['firstname'] = document.getElementById('firstname').value; window.localStorage['age'] = document.getElementById('age').value; window.localStorage['course'] = document.getElementById('course').value; } function show_local() { document.getElementById('firstname').value = window.localStorage['firstname']; document.getElementById('age').value = window.localStorage['age']; document.getElementById('course').value = window.localStorage['course']; }
about 4 years ago · Juan Pablo Isaza Denunciar

0

Prueba esto :

 function add_local() { const display = {}; display.firstname = document.getElementById('firstname').value; display.age = document.getElementById('age').value; display.course = document.getElementById('course').value; window.localStorage.setItem('display', JSON.stringify(display)); }

y para mostrar prueba esto:

 function show_local() { let _display = JSON.parse(localStorage.getItem("display")); document.getElementById('firstname').value = _display.firstname; document.getElementById('age').value = _display.age; document.getElementById('course').value = _display.course; document.getElementById('display').value = Object.values(_display); }

https://jsfiddle.net/3tj8okxm/

about 4 years ago · Juan Pablo Isaza Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda