对于可访问性,您可以在表单中使用部分和字段集来避免嵌套字段集吗?

问题描述 投票:0回答:0

我研究了字段集的可访问性使用,共识似乎是嵌套字段集。但是在某些情况下,我需要单一形式的组内组。是否可以在表单中使用带有 aria-labelledby 的部分来包含代码中的字段集以供访问?


For example I am wondering if within a single form I can use a section to contain "your details" which contains a few fieldsets with legends and then another section within the form that contains "your child's details" and those inputs, some contained in more fieldsets. This would  mean the fieldsets were nested in sections instead of other fieldsets. Would this still be accessible and symantic HTML? 

Anyone know if this is correct or have an opinion? Cropped down form example below:
`

<form>
  <h2 id="label_parent">Your Details (parent or guardian)</h2>
  <section aria-labelledby="label_parent">
    <label for="name">Full Name</label>
    <input type="text" id="name" name="name"><br>
    <fieldset>
      <legend>Pronoun</legend>
      <label for="he/him">he/him</label>
      <input type="radio" id="he/him" name="parent_pronoun">
      <label for="she/her">she/her</label>
      <input type="radio" id="she/her" name="parent_pronoun">
      <label for="they/them">they/them</label>
      <input type="radio" id="they/them" name="parent_pronoun">
    </fieldset>
  </section>

  <h2 id="label_child">Your Child's Details</h2>
  <section aria-labelledby="label_child">
    <label for="child_name">Full Name</label>
    <input type="text" id="child_name" name="child_name"><br>

    <fieldset>
      <legend>Pronoun</legend>
      <label for="child_he/him">he/him</label>
      <input type="radio" id="child_he/him" name="child_pronoun">
      <label for="child_she/her">she/her</label>
      <input type="radio" id="child_she/her" name="child_pronoun">
      <label for="child_theythem">they/them</label>
      <input type="radio" id="child_they/them" name="child_pronoun">
    </fieldset>
  </section>
  <button>Submit</button>
</form>

`

forms accessibility wai-aria sections fieldset
© www.soinside.com 2019 - 2024. All rights reserved.