HTML Checkbox Not Working: Form Interaction Issue
I'm working on a form, and I want to include a checkbox that users can toggle. However, when I click the checkbox, nothing happens. It's like it's frozen.
This is my code
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Checkbox Conundrum</title>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<form>
<label for="agree">Agree to Terms:</label>
<input type="checkbox" id="agree" name="agree">
<button type="submit">Submit</button>
</form>
<script src="script.js"></script>
</body>
</html>
Any idea why the checkbox isn't responding to clicks?
Answers
-
Hi Nilesh,
Not having access to the style.css or the scripts.js to verify - it's likely that there is something in either of those files that causes an error / disables the interaction with the checkbox.
You can see what is going wrong with your page by viewing the console on your browser. This is accessible in most browsers with the keyboard shortcut keyboard shortcut: "Cmd + Option + J" (on a Mac) or "Ctrl +Shift +J" (on Windows).Hope this helps,
Corné