Search code examples
htmlinternet-explorerdrop-down-menujaws-screen-reader

JAWS 17 doesn't read aria-label in Select box option in IE


I'm trying to add more usability to my Select box for screen reader users. Right now they have to remember the options to select the right answer. I am using aria-label to provide additional information in the 'option'. It works fine with Firefox and Chrome but not with IE 11 or less. It seems to be okay with Edge. Is there a work around or another option to get it to work in IE 11?

Code:

      <option id="question1_item0">Select</option>

      <option id="question1_item1" aria-label="1 an actor" >1</option>

      <option id="question1_item2" aria-label="2 a country" >2</option>

      <option id="question1_item3" aria-label="3 a color" >3</option>

      <option id="question1_item4" aria-label="4 a wesite" >4</option>

    </select>

Solution

  • Label is the name of an input in a form. Not every option in a select.

    Can you try it like this?

    <label for="actor">Actor:</label>
    <select id="actor">
      <option label="Select">Select</option>
      <option label="1">1</option>
      <option label="2">2</option>
      <option label="3">3</option>
      <option label="4">4</option>
    </select>