summaryrefslogtreecommitdiff
path: root/Base/res/html/misc/checkbox.html
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>