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

163
Vistas
¿Cómo puedo ocultar este botón al hacer clic con javascript?

Aquí está mi código javascript para un botón "ver más". ¿Cómo puedo también hacer que desaparezca al hacer clic?

 function myFunction() { var x = document.getElementById("dsec"); if (x.style.display === "none") { x.style.display = "block"; } else { x.style.display = "block"; } } </script>
about 4 years ago · Juan Pablo Isaza
3 Respuestas
Responde la pregunta

0

Tendrá que darle a su botón una identificación y hacer lo mismo que está haciendo para su bloque de descripción.

es decir:

 function myFunction() { var x = document.getElementById("dsec"); var btn= document.getElementById("btn"); if (x.style.display === "none") { x.style.display = "block"; btn.style.display = "none"; } else { x.style.display = "none"; btn.style.display = "block"; } } </script>

... o similar. No estoy del todo seguro de qué está activando su 'myFunction' o sus referencias... pero el concepto está ahí.

En el futuro, valdría la pena agregar un poco más de contexto y revisar la ortografía de su código para que sea más fácil de ayudar.

También notaré que la sugerencia de @Scott Marcus de usar estilos reales en lugar de cosas en línea es la mejor técnica general.

about 4 years ago · Juan Pablo Isaza Denunciar

0

Realmente debería evitar los estilos en línea cuando sea posible y, en su lugar, confiar en las clases CSS, que son mucho más simples:

 // Get the references you'll need just once, not every time the function runs let content = document.querySelector(".partial"); // Set up event handlers using the modern, standard approach document.getElementById("seeMore").addEventListener("click", function(){ this.classList.add("hidden"); // Just add the CSS class content.classList.remove("partial"); // Show the full text });
 /* This class can be added or removed to any element when it needs to be shown or hidden. */ .hidden { display:none; } .partial { height:40px; overflow:hidden; }
 <div class="partial">What is Lorem Ipsum? Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</div> <button type="button" id="seeMore">See More</button>

about 4 years ago · Juan Pablo Isaza Denunciar

0

Verifique la identificación de su botón y sus selectores solo para asegurarse de que sea correcto, de todos modos, aquí hay un código que funciona. Si necesita ocultar el botón de forma sencilla, simplemente establezca su valor de visualización en Ninguno. Es como cambiar el valor css de la pantalla, pero solo está usando javascript. La otra opción que puede usar es eliminarlo del DOM, creo.

 function myFunction() { var x = document.getElementById("button"); x.style.display = "none"; //just let the css value of button to none }
 <button onclick="myFunction()" id="button">Click Me</button>

 var x = document.getElementById('button'); x.onclick = function () { document.getElementById('button').remove(); this.remove(); };
 <button onclick="myFunction()" id="button">Click Me</button>

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