在 IOS Safari 中禁用 select 選項

Question

我已經實現了一個表單，它需要使用 Javascript 禁用 select 框中的某些選項。 它在所有瀏覽器中都可以正常工作，但在 IOS 上的 Safari 中卻不行（桌面 Safari 做得對）。

我一直在尋找 web 但到目前為止似乎沒有人遇到這個問題，所以我不確定它是否是 Safari IOS 限制或我忽略的東西。

感謝您的幫助，米格爾

Answer 1

在為 iOS 開發時，除了刪除禁用的選項外，別無選擇。

對於 iPhone，圖片非常清晰：所有 select 列表在所有情況下都被設計為點擊輪，並且這些輪不接受禁用選項。 這顯示在 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

如果您將禁用選項更改為禁用空白 optgroup，它似乎可以提供所需的結果，而無需任何額外的 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"

...在選項元素上？