0

Here's my DOM

    <ul class="fsm-checkbox-list fsm-things-you-love-to-do" role="group">

            <li class="fsm-checkbox" role="checkbox" name="LOVE_TRAVEL" aria-checked="false">
                <span tabindex="4">Travel</span>
            </li>

            <li class="fsm-checkbox" role="checkbox" name="LOVE_SPORTS" aria-checked="false">
                <span tabindex="4">Play/watch sports</span>
            </li>

            <li class="fsm-checkbox" role="checkbox" name="LOVE_SHOP" aria-checked="false">
                <span tabindex="4">Shop</span>
            </li>

            <li class="fsm-checkbox" role="checkbox" name="LOVE_DANCE" aria-checked="false">
                <span tabindex="4">Read</span>
            </li>

     </ul>

'li' have a role of checkbox. onClick, aria-checked attribute is toggled between true and false. However sometimes when i click, Voiceover on IPAD reads 'selected' instead of 'checked' or 'unchecked'. Could someone please explain why this behaviour occurs and how can i solve this.

Syed Is Saqlain
  • 360
  • 1
  • 3
  • 13
  • "sometimes" - so you're saying the behaviour is intermittent? What have you done to try to isolate the circumstances where is does/doesn't happen like this? – Damien_The_Unbeliever Aug 22 '16 at 07:46
  • It happens on any of the elements in the above tree. It normally works fine. But sometimes it reads 'selected' sometimes it reads both 'checked/unchecked' and 'selected'. – Syed Is Saqlain Aug 22 '16 at 07:58

0 Answers0