html - Error de selección múltiple de Mobile Safari
ios select (2)
Si se encuentra un error realmente molesto en el safari móvil actual (iOS 9.2) (¡aparece por primera vez desde iOS 7!)
Si usa campos de selección múltiple en el safari móvil, como este:
<select multiple>
<option value="test1">Test 1</option>
<option value="test2">Test 2</option>
<option value="test3">Test 3</option>
</select>
¡Tendrás problemas con la selección automática!
iOS está seleccionando automáticamente la primera opción después de que hayas abierto la selección (sin interacción del usuario), pero no se te mostrará con el azul, selecciona "verificar".
Entonces, si ahora selecciona la segunda opción, la selección le dirá que se seleccionaron dos opciones (pero solo resaltando una como seleccionada) ...
Si ahora cierra y abre de nuevo la selección, iOS anulará automáticamente la selección del primer valor; si repite, se volverá a seleccionar sin ninguna interacción del usuario.
Eso es un error del sistema realmente molesto, que está rompiendo la experiencia del usuario.
Después de una larga investigación, encontré la siguiente (no la más hermosa) solución:
El truco es agregar una opción de selección vacía y deshabilitada en la primera posición:
<select multiple>
<option disabled></option>
<option value="test1">Test 1</option>
<option value="test2">Test 2</option>
<option value="test3">Test 3</option>
</select>
¡Esto evitará que iOS seleccione automáticamente la primera opción y mantenga los valores de selección correctos y limpios!
La opción vacía no está visible y el recuento de las selecciones es correcto.
La solución para safari multi select bug y Empty and Disabled option marca problema relacionado:
<select multiple>
<optgroup disabled hidden></optgroup>
<option value="0">All</option>
<option value="1">Test 1</option>
<option value="2">Test 2</option>
<option value="3">Test 3</option>
<option value="4">Test 4</option>
</select>
Agregue un grupo de opciones oculto y deshabilitado antes de las opciones reales.