making an alert() if checkbox is checked in html using js [duplicate]

Question

so i wrote an html page just for testing but i cant get the script work and its just says the alert and checks the checkbox but i wanna that when i check the checkbox the alert will appear. here's the code (without style.css).

<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<header>
<p class="head1">SOME HEADING</p>
</header>
<div class="div1">
<h1>AN HEADING</h1>
<form>
<ul>
<li><input class="in1" id="checkboxid" type="checkbox">First Box</li>
<li><input class="in1" type="checkbox">Second Box</li>
<li><input class="in1" type="checkbox">Third Box</li>
</ul>
</form>
</div>
<script>
if (document.getElementById("checkboxid").checked = true) {
alert("You checked the first box.");
}
else {
alert("you didnt checked the box.");
}
</script>
</body>
</html>

Learn about event handlers.

SLaks
– SLaks

2017-11-20 21:58:44 +00:00
Commented Nov 20, 2017 at 21:58 — SLaks
– SLaks, Commented Nov 20, 2017 at 21:58

edkeveked · Accepted Answer · 2017-11-20 22:04:03Z

1

There is a mistake, you are using = instead of ===. Also, you can consider using a function change() that will be fired up when you first checkbox is checked or not.

<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<header>
<p class="head1">SOME HEADING</p>
</header>
<div class="div1">
<h1>AN HEADING</h1>
<form>
<ul>
<li><input class="in1" id="checkboxid" type="checkbox" onclick="change()">First Box</li>
<li><input class="in1" type="checkbox">Second Box</li>
<li><input class="in1" type="checkbox">Third Box</li>
</ul>
</form>
</div>
<script>
function change(){
  if (document.getElementById("checkboxid").checked === true) {
    alert("You checked the first box.");
  }
  else {
    alert("you didnt checked the box.");
  }
}
</script>
</body>
</html>

edited Nov 20, 2017 at 22:04

answered Nov 20, 2017 at 21:58

edkeveked

18.4k10 gold badges60 silver badges95 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Israel Shevkolenko Over a year ago

oh ok thx, i fixed it now and used a function so it'll work only when i check the box and not on page load, thx to Swakeert Jain telling my question is a duplicate from another question (see comment on the question). so here's what i got now:

function checkbox() { if (document.getElementById("checkboxid").checked === true) { alert("You checked the first box."); } else { alert("you didnt checked the box."); } }

edkeveked Over a year ago

@IsraelShevkolenko, Great, you solved it! Happy coding! You can mark the answer as accepted and upvote it.

Collectives™ on Stack Overflow

making an alert() if checkbox is checked in html using js [duplicate]

1 Answer 1

2 Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Linked

Related