檢測瀏覽器是否顯示<select multiple>作爲模式對話框

有什麼方法可以使用JavaScript檢測給定的瀏覽器是否將重點爲<select multiple>的元素渲染爲彈出框或單獨作爲內聯框？檢測瀏覽器是否顯示<select multiple>作爲模式對話框

在一些平臺，如Android瀏覽器和iOS Safari瀏覽器，使用彈出窗口可以通過比較，比如說高度進行檢測，

<select multiple> 
    <option>a</option> 
    <option>a</option> 
    <option>a</option> 
    <option>a</option> 
    <option>a</option> 
<select>

和

<select multiple> 
    <option>a</option> 
<select>

的高度是相同，因爲<select> s被縮減到一個下拉按鈕框。但是在Playbook等其他設備上，此測試會給出一個錯誤的否定結論，因爲Playbook瀏覽器呈現擴展選擇列表和會在點擊時顯示彈出窗口。

任何人都可以想出一個可靠的方法來確定是否顯示本機選擇彈出？

來源

2011-07-18 kpozin

爲什麼要檢測這個？如何渲染這樣的組件取決於客戶端，而不是您。除非你有一個非常具體的原因，否則你應該單獨放棄這種行爲。 – Brad

我正在使用jQuery Mobile開發一個項目，並試圖提出一種替代jQuery Mobile的[選擇菜單]（http://jquerymobile.com/test/docs/forms/forms-selects.html）的演示文稿。顯示選擇選項的原生方法在不顯示彈出窗口的瀏覽器中不起作用，而兩種樣式的版本性能相當差。我希望能夠始終使用本機控件，使用本機彈出式窗口或假覆蓋。 – kpozin

請注意* select *的* size *選項。如果這是'1'，則瀏覽器可以將該元素呈現爲內嵌元素。 – sergzach

它看起來像masedesign朝着這一領先，但我會走一步：

或許檢測移動瀏覽器VS非移動瀏覽器（如RIM， Android，iOS設備等VS FF，鉻，歌劇，Safari瀏覽器，IE等）

來源

2011-08-10 03:43:30 Jacksonkr

jQuery Mobile的Beta 2中爲您提供了菜單，而不是使用自定義的原生者的選擇：

http://jquerymobile.com/demos/1.0b2/#/demos/1.0b2/docs/forms/selects/index.html

來源

2011-08-23 22:37:04 mynameistechno

自從他們發佈第一個alpha版本以來，這是一個選項。正如我在上面的評論中提到的那樣，問題在於即使是最快的移動設備（例如iPad 2），大型自定義菜單的性能也相當差，所以我試圖想出一些混合原生/自定義替代方案。 – kpozin

完成後請分享您的解決方案！謝謝 – mynameistechno

檢測瀏覽器是否顯示<select multiple>作爲模式對話框

回答

相關問題