Определите, показывает ли браузер ‹выберите несколько› как модальное диалоговое окно

Есть ли способ использовать JavaScript, чтобы определить, отображает ли данный браузер сфокусированный элемент <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 отображает развернутые списки выбора и показывает всплывающие окна при нажатии на них.

Может ли кто-нибудь придумать надежный способ определить, отображается ли всплывающее окно с собственным выбором?


javascript html select cross-browser browser-feature-detection
person kpozin    schedule 18.07.2011    source источник
comment
Зачем вам это обнаруживать? Как отрендерить такой компонент зависит от клиента, а не от вас. Если у вас нет очень конкретной причины, вы должны оставить это поведение в покое.   -  person Brad    schedule 19.07.2011
comment
Я работаю над проектом с использованием jQuery Mobile и пытаюсь придумать альтернативу представлению jQuery Mobile выберите меню. Их собственный подход к отображению параметров выбора не работает в браузерах, в которых не отображаются всплывающие окна, в то время как две стилизованные версии имеют довольно низкую производительность. Я хотел бы иметь возможность всегда использовать собственный элемент управления, используя либо собственное всплывающее окно, либо поддельный оверлей.   -  person kpozin    schedule 19.07.2011
comment
Обратите внимание на опцию size для select. Если это «1», браузер может отображать элемент как встроенный элемент.   -  person sergzach    schedule 27.07.2011
comment
Для чего-то вроде этого я бы, вероятно, обнаружил сам браузер и создал определенные условия для каждого браузера (Android, iOS, WebOS и т. Д.).   -  person stewart715    schedule 01.08.2011
comment
Согласен с masedesign. Вы можете установить несколько регулярных выражений для получения браузера и операционной системы, а затем жестко закодировать другое поведение, но каждый раз, когда вы пытаетесь смешивать собственные элементы управления и визуализированные элементы управления, у вас будут проблемы. Классическим примером может быть AWT, Swing, SWT.   -  person Josep Valls    schedule 08.08.2011

Ответы (2)


arrow_upward
1
arrow_downward

Похоже, masedesign ведет к этому, но я собираюсь пойти еще дальше:

Возможно обнаружение мобильных браузеров против немобильных браузеров (например, RIM, Android, iOS и т. Д. VS FF, Chrome, Opera, Safari, IE и т. Д.)

person Jacksonkr    schedule 10.08.2011

arrow_upward
0
arrow_downward

jQuery Mobile Beta 2 дает вам возможность использовать пользовательские меню вместо собственных:

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

person mynameistechno    schedule 23.08.2011
comment
Это вариант с момента их первого альфа-выпуска. Однако, как я уже упоминал в комментарии выше, проблема в том, что большие настраиваемые меню имеют довольно низкую производительность даже на самых быстрых мобильных устройствах (например, iPad 2), поэтому я пытаюсь придумать какую-то гибридную родную / настраиваемую альтернативу. . - person kpozin; 24.08.2011