Intereting Posts
Можно ли переопределить собственный метод в классе Java в Android / dalvik? Возможность рисования вокруг своего центра Android Как сделать свой Android ContentObserver для ContactsContract обнаруженным добавленным, обновленным или удаленным контактом? Как узнать, изменилось ли пользователь состояние кнопки переключения? Как получать измененные значения громкости для типа потока голоса (в режиме «звонок»)? Почему JUnit 4 на Android не работает? Вкладка EditText Android Html.fromHtml (String) не работает для <font color = '#'> text </ font> Как получить android_id устройства? Android обратное геокодирование getLocality возвращает часто null Как открыть приложение для Android, если оно установлено, и перейти на рынок Android, если не установить Sdkmanager vs "android update sdk" для установки зависимостей Использование putExtra для передачи значений в службу намерения Android TabHost.addTab -> Исключение нулевого указателя Есть ли способ показать полосу прокрутки ListView все время?

Multi Выберите <select> на мобильных устройствах

У меня есть интерфейс, который использует множественные списки выбора с высотой набора css для заполнения других списков.

В основном:

<select multiple="multiple" size="5" style="height:150px;"> <option value='1'>one</option> <option value='2'>two</option> <option value='3'>three</option> <option value='4'>four</option> </select> <select multiple="multiple" style="height:150px;"></select> 

Используя jQuery, в основном вы выбираете некоторые вещи в первом, и он перемещает их во второй.

Это отлично работает, и наши пользователи любят это в немобильных средах. НО, на Android-планшетах, телефонах, iphones и ipads, списки выглядят пустыми, пока вы не нажмете, и в нем отображается встроенный интерфейс выбора прокрутки. Таким образом, вы не можете видеть новые, когда они добавляются ко второму списку.

Этот очень простой jsFiddle показывает, о чем я говорю, когда поля выбора не отображают их содержимое:

http://jsfiddle.net/VhXwA/2/

Есть ли способ переопределить это поведение без необходимости делать свою собственную вещь или использовать совершенно другой способ сделать это для мобильных устройств?

Если нет способа сделать это, что было бы лучшим способом реализовать что-то подобное, мобильное?

Редактировать:

Вот основная картина того, как выглядит этот интерфейс, списки в любом поле могут быть очень длинными или короткими. Но они имеют заданную высоту, для согласованности: пример

Редактировать: Я не могу себе представить, что я единственный, кто сталкивался с этим! Должен быть способ заставить мобильные браузеры вести себя правильно.

Solutions Collecting From Web of "Multi Выберите <select> на мобильных устройствах"

Такое поведение в мобильных браузерах по дизайну улучшает работу пользователей. Согласно Руководству по веб-контенту Safari

Использование элемента выбора. Если вы используете элемент HTML для выбора на своей веб-странице, iOS отображает пользовательский элемент управления, который оптимизирован для выбора элементов в списке с помощью пальца в качестве устройства ввода. На iOS пользователь может щелкнуть, чтобы прокрутить список и нажать, чтобы выбрать элемент из списка.

Это сказано:

  • Я бы рекомендовал не бороться с ним, но использовать его ради мобильных пользователей
  • Использовать медиа-запросы для применения разных css для ваших элементов select для настольных и мобильных браузеров;
  • Если количество отображаемых параметров достаточно мало, рассмотрите возможность использования <input type="checkbox">

    Вместо того, чтобы select потому что это поведение согласовано между браузерами.

Из того, что я понимаю, я думаю, что было бы намного проще перенаправить на другую страницу в зависимости от выбранной опции, если не будет причин, по которым вы не выбрали это в первую очередь.

Я не понимаю, почему вы не можете просто использовать раскрывающийся список флажков. Они совместимы почти везде и конечно на всех смартфонах.

 <select name="Dropdown1"> <option value="o1">Option 1</option> <option value="o2">Option 2</option> <option value="o3">Option 3</option> <option value="o4">Option 4</option> </select> 

Или

 <input type="checkbox" name="checkbox" value="o1">Option 1<br> <input type="checkbox" name="checkbox" value="o2">Option 2 

( http://www.w3schools.com/html/tryit.asp?filename=tryhtml_select2 и http://www.w3schools.com/html/html_forms.asp )

Я использую подобный интерфейс, и он отлично подойдет для пользователей настольных компьютеров, но совершенно не интуитивно понятен на сенсорных устройствах, где мультивыбор не отображается как многострочный прокручиваемый список.

Похоже, вам нужен полностью настраиваемый элемент управления, но я нашел два элемента управления JQuery, которые, как представляется, реализуют эту функциональность (хотя и несколько иначе).

Eric Hynds Jquery UI multiselect: http://www.erichynds.com/blog/jquery-ui-multiselect-widget

Quasi Partikels сортируемый многопользовательский виджет с возможностью поиска: http://quasipartikel.at/multiselect/

Оба они кажутся немного затруднительными на устройстве размера телефона, но особенно в версии Quasi Partikel, которая использует небольшой «+» слева от элемента, чтобы добавить его, в то время как Eric Hynds позволяет задействовать весь элемент для выбора / отмены выбора , Либо можно улучшить с помощью мобильных конкретных стилей, чтобы увеличить размер критических элементов, я полагаю.