Question

我已经实现了一个表单，需要使用Javascript禁用选择框中的某些选项。它适用于所有浏览器，但不适用于IOS上的Safari（Desktop Safari可以正确使用）。

我一直在寻找网络，但到目前为止似乎没有人遇到这个问题，所以我不确定这是Safari IOS限制还是我忽视的事情。

感谢您的帮助，米格尔

Answer 1

除了在开发iOS时删除已禁用的选项，别无选择。

对于iPhone，图片非常清晰：所有选择列表在所有情况下都被设置为点击轮，并且这些轮子不接受禁用选项。这在iPhone模拟器和实际iPhone上都有显示。

对于iPad来说，图片更令人困惑。 iPad模拟器会使禁用的选项变灰并真正使它们被禁用，就像移动Safari和桌面Safari一样。但是实际的 iPad（iPad 1，运行iOS 4.2.1，在我的情况下）会显示点击轮。

所以在你的剧本中尽早做这样的事情：

// check for ios device
nP = navigator.platform;      
if (nP == "iPad" || nP == "iPhone" || nP == "iPod" || nP == "iPhone Simulator" || nP == "iPad Simulator"){
    $('select option[disabled]').remove();
}

Answer 2

我有一个可能对你有帮助的解决方案，它不需要jQuery ......

我的问题是选项是动态启用和禁用的，因此通过jQuery删除选项的想法避免了它们被重用。

所以我的解决方案就是像这样修改 innerHTML ：

function swapAvailOpts(A, B) {
  content = document.getElementById(B);
  switch (A) {
    case "X":
      content.innerHTML = '<optgroup label="X"><option>X1</option><option>X2</option></optgroup>';
      break;
    case "Y":
      content.innerHTML = '<optgroup label="Y"><option>Y1</option><option>Y2</option></optgroup>';
      break;
    default:
      content.innerHTML = '<optgroup label="Z"><option>Z1</option><option>Z2</option></optgroup>';
  }
}

<select name="choose" onChange="swapAvailOpts(this.value,'Choices');">
  <option>X</option>
  <option>Y</option>
  <option>Z</option>
</select>
<select name="Choices" id="Choices">
  <optgroup label="X">
    <option>X1</option>
    <option>X2</option>
  </optgroup>
</select>

Answer 3

如果您将已禁用的选项更改为已禁用的空白选项组，则似乎无需任何额外的javascript即可提供所需的结果。

<optgroup disabled></optgroup>

与通常的

相反

<option disabled></option>

Answer 4

作弊。取代

<option value="somevalue">Label text</option>

与

<optgroup label="Label text"></optgroup>

和

的样式

optgroup:empty { ... }

Answer 5

你试过了吗？

disabled="disabled"

...在选项元素上？

在IOS Safari中禁用选择选项

5 个答案: