Предоставление фокус <select> элементов в мобильном IE (WP8)

Question

Я работаю над HTML 5 на основе веб-приложений, которые в конечном итоге будет развернут на IOS, Android и Windows Phone 8 (возможно 7 тоже)

One часть приложения включает в себя выбор пользователем параметров из выпадающего меню select.

Поскольку эти элементы формы не очень стильные, я придумал решение, в котором у меня есть CSS, перемещение элементов select в абсолютное положение, -10000px сверху, чтобы они не отображались в приложении.

Приложение. затем вставляет в свое место элемент a, который имеет стиль, похожий на простой блок с текущим выбранным значением, записанным внутри него.

Когда пользователь удаляет элемент a, я использую jQuery (2.0) для перехвата крана и установки фокуса на элемент select, тем самым поднимая нормальный механизм выбора, используемый в веб-браузере.

Это безупречно работает на iOS. Еще не пробовал это на Android, но он вообще не работает в IE Windows Phone 8.

Есть ли какое-либо известное обходное решение для этого? Это просто, что IE не фокусируется на выборе, или он дает фокус, но не открывает меню выбора?

Answer 1

Из того, что я знаю, JQuery 2.0 не работает в IE> 8

Помните, что JQuery 2.0 не будет работать на IE 6, 7 или 8; мы сохраняем , что долг для jQuery 1.9. Мы полностью ожидаем, что большинство интернет-сайтов могут продолжать использовать jQuery 1.x довольно долгое время, если старые версии версий IE по-прежнему составляют значительную часть веб-серферов. И , поэтому команда jQuery также продолжит поддерживать как строки jQuery 1.x , так и 2.x. Не чувствуйте, что вы что-то упустили или упали позади, используя 1.9 на своем веб-сайте, поскольку API-интерфейсы для 1.9 и 2.0 совпадают.

http://blog.jquery.com/2013/03/01/jquery-2-0-beta-2-released/

Answer 2

я не обнаружил причину этой проблемы, но работал вокруг него, а не с помощью обычных select элементов и укладки их с помощью CSS.

Чтобы избежать кнопки стрелка раскрывающегося списка видно, я использовал jQuery.wrap() обернуть select элементы в div элементов, в стиле, как я хочу с select элементов шире, чем div, то есть:

div { 
    border: 1px solid #FFF; 
    overflow: hidden; 
    width: 100px; 
} 

div select { 
    background: transparent; 
    border: 0; 
    padding: 8px 10px; 
    color: #FFF; 
    width: 150px; /* wider than the div, to hide the drop-down arrow */ 
}