0
245
ViewsHow to lock content until user does a task?
I am currently developing a “course” platform, and I want to prevent the user from advancing to the next topic until they click the last item on the current topic.
In this first activity I want that the next button is disabled or something like that until the user downloads the file, so clicks on the download image.
I assume it will be with JavaScript by changing the value on the HTML item with a getElementByID or with an eventListener, but I am not clear on how to proceed.
I am not using input fields so I can't use disabled. I am using images inside of an tag as it shows here:
Do you guys know how can I do this?
2 answers
Answer question0
<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>
0
Yes, you can do this in multiple ways using javaScript. Here are some examples:
Disable/Non-Clickable an HTML button in Javascript
Simplest way I can think of:
<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>