Displaying Items Based On HTML 5 Checkbox Input
If I have two HTML 5 checkboxes like these…
<input name="your_name" value="your_value1" type="checkbox"> <input name="your_name2" value="your_value2" type="checkbox">
How can I display a textarea (or any other HTML 5 item) based on the input of the user? For example, if they selected value1 show one block of text, if they selected value2 show a different block of text. What would be the best way to do this, without having to reload the page or submit a form?
If the elements are siblings, the simplest approach would be to use the
:checked pseudo class to determine if the checkbox is checked. Then you can use the general sibling selector,
~, to select the following sibling element(s) depending on the checked state:
change event listener to the checkbox element.