Mobile Safari多选bug

Question

如果在当前（iOS 9.2）移动游戏中发现了一个非常烦人的错误（自iOS 7以来首次出现！）

如果您在移动版Safari中使用多选字段，请执行以下操作：

<select multiple>
    <option value="test1">Test 1</option>
    <option value="test2">Test 2</option>
    <option value="test3">Test 3</option>
</select>

自动选择会遇到问题！

iOS打开选择后会自动选择第一个选项（没有任何用户交互） - 但不会通过蓝色选择“检查”显示给你。

因此，如果您现在选择第二个选项，则选择将告诉您选择了两个选项（但仅突出显示一个选项）......

如果您现在关闭并再次打开选择，iOS将自动取消选择第一个值 - 如果您重复，它将再次被选中而无需任何用户交互。

这是一个非常烦人的系统错误，它打破了用户体验！

Answer 1

解决safari多选错误和清空和禁用选项勾选相关问题：

＆＃13;

＆＃13;

<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>

＆＃13;

＆＃13;

＆＃13;

在真实选项之前添加禁用和隐藏的optgroup。

Answer 2

经过长时间的研究，我发现了以下（不是最美丽的）但工作解决方案：

诀窍是在第一个位置添加空和禁用选项：

<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自动选择第一个选项并保持选择值正确并清理！

空选项不可见，选择的计数正确。