移动 Safari 多选错误

Posted 2023-02-22

【中文标题】移动 Safari 多选错误

【英文标题】：Mobile Safari multi select bug

【发布时间】：2016-04-12 03:49:18

【问题描述】：

如果在当前 (ios 9.2) 移动 safari 中发现了一个非常烦人的错误（自 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 会在您打开选择后自动选择第一个选项（无需任何用户交互） - 但它不会通过蓝色选择“检查”显示给您。

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

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

这是一个非常烦人的系统错误，正在破坏用户体验！

【问题讨论】：

我在苹果提交了一个错误报告，让我们拭目以待。

@migg 这个 bug 已经出现在两年前发布的 iOS 7 上......希望苹果最终能尽快修复它：/

但我无法在 9.1 上重现它，所以在我看来它是在 9.2 中引入的。但我没有 7 个要检查。

@migg 好吧，这很奇怪！我在我的 9.2 iPhone 和 7.1 & 8.1 iOS 模拟器上对其进行了测试——所有这些都受到了这个错误的影响......

错误报告被标记为我无法查看的已打开工单的副本。

【参考方案1】：

解决 safari 多选错误和 Empty 和 Disabled 选项勾选相关问题：

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

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

【讨论】：

这对我有用，我认为这是最好的方法，谢谢

这有什么更新吗？因为使用 optgroup 会导致我的移动应用程序崩溃。

对我来说仍然是个问题（iPhone 7，最新版本的 iOS 10）。真是让人头疼。

【参考方案2】：

经过长时间的研究，我发现了以下（不是最漂亮的）但可行的解决方案：

诀窍是在拳头位置添加一个empty and disabled选择选项：

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

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

【讨论】：

单击列表顶部时仍会出现勾号

在选项之前（或包装）添加 也可以解决问题。这也可以防止在单击时出现勾号。一个空行仍然可见，可能是为 optgroup 标签属性值保留的。

@tejal-raval 之前的解决方案更好。

有没有办法在移动视图上显示/隐藏“0 项”标签？我有一个问题，我在两个相互影响的选择列表中有多个选项。当我将选项“添加”到第二个列表时，它不会显示任何迹象表明其中是否有任何内容。