Is there a way to make the ios voice over focus on a specific element following a user interaction?
I have tried a version of the following example in a React codebase, by using the focus method on a select element when an option gets selected, however while this works on a web browser, it doesn't work on the ios device, instead the focus moves to whatever was behind the option selected.
So for instance if the 'Saab' option was selected, I'd like the user to remain on the dropdown but instead they land on a div element that was behind the Saab dropdown list.
Using a screen reader on a browser I can see that the focus method works to keep the user on the dropdown but on the ios device with voice over, the focus jumps to the item behind.
handleChange = (e) => {
document.getElementById("cars").focus({preventScroll: true});
}
<select id="cars" name="cars" id="cars" onChange = (e) => {this.handleChange(e)}>
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="mercedes">Mercedes</option>
<option value="audi">Audi</option>
</select>