mirror of
https://github.com/LadybirdBrowser/ladybird.git
synced 2024-11-26 17:40:27 +00:00
Base: Add test page for HTML input type=radio elements
This commit is contained in:
parent
136d774885
commit
274e94224d
Notes:
sideshowbarker
2024-07-18 20:52:28 +09:00
Author: https://github.com/trflynn89 Commit: https://github.com/SerenityOS/serenity/commit/274e94224d2 Pull-request: https://github.com/SerenityOS/serenity/pull/6089
2 changed files with 53 additions and 0 deletions
52
Base/res/html/misc/radio.html
Normal file
52
Base/res/html/misc/radio.html
Normal file
|
@ -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>
|
|
@ -46,6 +46,7 @@ span#loadtime {
|
||||||
<li><a href="float-3.html">floating boxes with overflow=hidden</a></li>
|
<li><a href="float-3.html">floating boxes with overflow=hidden</a></li>
|
||||||
<li><a href="padding-inline.html">inline elements with padding</a></li>
|
<li><a href="padding-inline.html">inline elements with padding</a></li>
|
||||||
<li><a href="event-bubbling-and-multiple-listeners.html">event bubbling and multiple listeners</a></li>
|
<li><a href="event-bubbling-and-multiple-listeners.html">event bubbling and multiple listeners</a></li>
|
||||||
|
<li><a href="radio.html">radio button</a></li>
|
||||||
<li><a href="checkbox.html">checkbox</a></li>
|
<li><a href="checkbox.html">checkbox</a></li>
|
||||||
<li><a href="canvas-rotate.html">canvas rotate()</a></li>
|
<li><a href="canvas-rotate.html">canvas rotate()</a></li>
|
||||||
<li><a href="margin-collapse-2.html">margin collapsing 2</a></li>
|
<li><a href="margin-collapse-2.html">margin collapsing 2</a></li>
|
||||||
|
|
Loading…
Reference in a new issue