Actualmente estoy desarrollando una plataforma de "curso" y quiero evitar que el usuario avance al siguiente tema hasta que haga clic en el último elemento del tema actual.
En esta primera actividad quiero que el siguiente botón esté deshabilitado o algo así hasta que el usuario descargue el archivo, entonces haga clic en la imagen de descarga.
Supongo que será con JavaScript cambiando el valor en el elemento HTML con un getElementByID o con un eventListener, pero no tengo claro cómo proceder.
No estoy usando campos de entrada, así que no puedo usar deshabilitado. Estoy usando imágenes dentro de una etiqueta como se muestra aquí:
¿Saben cómo puedo hacer esto?
<body> <input type="button" id="button1" value="Task 1" onclick="unlockButton()" /> <input type="button" id="button2" value="Task 2" disabled /> <script> function unlockButton() { document.getElementById("button2").disabled = false; } </script>Sí, puede hacer esto de varias maneras usando javaScript. Aquí hay unos ejemplos:
Deshabilitar / No se puede hacer clic en un botón HTML en Javascript
La forma más simple que se me ocurre:
<html> <head> <script> function unlockButton() { document.getElementById("button2").disabled = false; } </script> </head> <body> <input type="button" id="button1" value="Task 1" onclick="unlockButton()" /> <input type="button" id="button2" value="Task 2" disabled /> </body> </html>