Сделайте радио-метку активной на сенсорных мобильных устройствах - PullRequest
Новая
       17

Сделайте радио-метку активной на сенсорных мобильных устройствах

2 голосов
/ 01 апреля 2012

Я сделал HTML Wizzard для оформления заказа. Есть четыре шага, в каждом есть куча переключателей. Я изменил дизайн каждой метки переключателя на большую кнопку (и скрыл сам радиовход). Все это отлично работает на классическом ПК. Но у меня возникла проблема с мобильным устройством (iPHONE & iPAD, я не могу проверить его на других устройствах, потому что у меня его нет), которые не могут выбрать переключатель.

Я нашел только одно уведомление об этой проблеме здесь в stackoverflow, но опубликованное там решение также не работает.

Оригинальное вдохновение исходит от интернет-магазина Apple для выбора другого цвета устройства.

Мой пример кода: 

<label class="option" for="edit-term-worker">
<input id="edit-term-worker" class="form-radio" type="radio">
<span class="worker-name">Sandra</span>
</label>

Тут нужен JS, или у меня есть какой-то недостаток в коде?

Спасибо всем за помощь.

1 Ответ

6 голосов
/ 01 апреля 2012

Вы пробовали это? 

<input id="edit-term-worker" class="form-radio" type="radio" />
<label class="option" for="edit-term-worker"  onclick="">
<span class="worker-name">Sandra</span>
</label>

РЕДАКТИРОВАТЬ: Добавлен пустой клик, в соответствии с этим, который должен делать трюк: HTML

Обратите внимание, что вы не должны помещать переключатель в тег метки, он должен быть снаружи.

...