Question

我使用select作为移动设备的导航菜单。

由于optgroup在iOS上渲染得非常糟糕，我一直在使用禁用选项和连字符对某些子菜单进行分组。

即：

<select>
    <option value="" disabled>Menu</option>
    <option value="sub1">- Sub 1</option>
    <option value="sub2">- Sub 2</option>
</select>

如预期的那样，桌面浏览器无法选择已禁用的option。但是在iOS上，你可以实际选择它，即使它是灰色的。然后触发我的AJAX代码动态更改页面内容，只会造成大麻烦。

我可以＆＃34;蛮力＆＃34;通过在我的AJAX函数中添加一些if检查语句来取消这个，但我真的想知道为什么在iOS Safari上首先可以选择禁用元素？

My site is here（您必须在桌面上调整宽度<700px，但需要iOS来选择禁用的元素）

Answer 1

除了禁用该选项外，我还通过将display: none;添加到代码中的style属性来实现该功能。

<option value="12000">$12,000</option>
<option value="15000">$15,000</option>
<option disabled="" style="display: none;" value="20000">$20,000</option>
<option disabled="" style="display: none;" value="25000">$25,000</option>

我并不是说这是最佳选择，但是它无法为iOS Safari选择选项。

禁用<选项>仍可在iOS上选择</option>

1 个答案: