blob: a4126f5742aefcc802ad51d8f6d9b76e948cae9e (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
|
<html>
<input id=foo type=checkbox>
<label for=foo>Checkbox 1 (with a "for" attribute)</label>
<pre id=foo-status></pre>
<label>
<input id=bar type=checkbox>
Checkbox 2 (inside a label element)
</label>
<pre id=bar-status></pre>
<script>
var foo = document.getElementById("foo");
var fooStatus = document.getElementById("foo-status");
fooStatus.innerHTML = `Checkbox 1: ${foo.checked}\n`;
var bar = document.getElementById("bar");
var barStatus = document.getElementById("bar-status");
barStatus.innerHTML = `Checkbox 2: ${bar.checked}\n`;
foo.addEventListener("change", function() {
fooStatus.innerHTML = `Checkbox 1: ${foo.checked}\n`;
});
bar.addEventListener("change", function() {
barStatus.innerHTML = `Checkbox 2: ${bar.checked}\n`;
});
</script>
</html>
|