|
@@ -0,0 +1,52 @@
|
|
|
+<body>
|
|
|
+ <b>Pick your house!</b>
|
|
|
+ <br />
|
|
|
+ <input type=radio id=gryffindor name=hp value=Gryffindor>
|
|
|
+ <label for=gryffindor>Gryffindor</label>
|
|
|
+ <br />
|
|
|
+ <input type=radio id=hufflepuff name=hp value=Hufflepuff>
|
|
|
+ <label for=hufflepuff>Hufflepuff</label>
|
|
|
+ <br />
|
|
|
+ <input type=radio id=ravenclaw name=hp value=Ravenclaw>
|
|
|
+ <label for=ravenclaw>Ravenclaw</label>
|
|
|
+ <br />
|
|
|
+ <input type=radio id=slytherin name=hp value=Slytherin>
|
|
|
+ <label for=slytherin>Slytherin</label>
|
|
|
+
|
|
|
+ <br />
|
|
|
+ <br />
|
|
|
+
|
|
|
+ <b>Pick your other house!</b>
|
|
|
+ <br />
|
|
|
+ <input type=radio id=stark name=got value=Stark>
|
|
|
+ <label for=stark>Stark</label>
|
|
|
+ <br />
|
|
|
+ <input type=radio id=lannister name=got value=Lannister>
|
|
|
+ <label for=lannister>Lannister</label>
|
|
|
+ <br />
|
|
|
+ <input type=radio id=baratheon name=got value=Baratheon>
|
|
|
+ <label for=baratheon>Baratheon</label>
|
|
|
+ <br />
|
|
|
+ <input type=radio id=targaryen name=got value=Targaryen>
|
|
|
+ <label for=targaryen>Targaryen</label>
|
|
|
+
|
|
|
+ <script>
|
|
|
+ const hp = document.getElementsByName('hp');
|
|
|
+ for (let i = 0; i < hp.length; ++i) {
|
|
|
+ hp[i].addEventListener('change', function() {
|
|
|
+ if (this.checked) {
|
|
|
+ console.log('HP house:', this.value);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+
|
|
|
+ const got = document.getElementsByName('got');
|
|
|
+ for (let i = 0; i < got.length; ++i) {
|
|
|
+ got[i].addEventListener('change', function() {
|
|
|
+ if (this.checked) {
|
|
|
+ console.log('GoT house:', this.value);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+ </script>
|
|
|
+</body>
|