移动Safari多选错误
如果发现一个真正恼人的错误在当前(iOS 9.2)移动Safari(首先出现自iOS 7!)
如果您在移动Safari上使用多个select字段 – 如下所示:
<select multiple> <option value="test1">Test 1</option> <option value="test2">Test 2</option> <option value="test3">Test 3</option> </select>
你将有自动select的问题!
在打开select(没有任何用户交互)之后,iOS会自动select第一个选项,但不会用蓝色select“检查”显示给您。
所以,如果你现在select第二个选项,select将告诉你,select了两个选项(但只高亮显示一个select)…
如果您现在closures并再次打开select,iOS将自动取消select第一个值 – 如果您重复,则会在没有任何用户交互的情况下再次select。
这真是一个恼人的系统错误,这是打破用户体验!
Safari浏览器多选错误和空白和禁用选项打勾相关的问题的解决scheme:
<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>
经过长时间的研究,我发现以下(不是最美丽的),但工作的解决scheme:
诀窍是在第一个位置添加一个空的和禁用的select选项:
<select multiple> <option disabled></option> <option value="test1">Test 1</option> <option value="test2">Test 2</option> <option value="test3">Test 3</option> </select>
这将防止iOS自动select第一个选项,并保持select值正确和干净!
空白选项不可见,select的计数是正确的。