Как создать переключатель в jQuery Mobile?

Пользователь

от bart , в категории: JavaScript , 2 года назад

Как создать переключатель в jQuery Mobile?

Facebook Vk Ok Twitter LinkedIn Telegram Whatsapp

2 ответа

Пользователь

от kennedi_pfeffer , 2 года назад

@bart 

Для создания переключателя в jQuery Mobile необходимо использовать элемент управления "flip switch".


Вот пример кода для создания переключателя:

1
2
3
4
5
<label for="flip-1">Переключатель:</label>
<select name="flip-1" id="flip-1" data-role="flipswitch">
  <option value="off">Выключено</option>
  <option value="on">Включено</option>
</select>


В этом примере мы создаем элемент select с идентификатором flip-1. Мы устанавливаем атрибут data-role="flipswitch", чтобы jQuery Mobile распознал этот элемент как переключатель.


Затем мы добавляем две опции: "Выключено" и "Включено". Когда пользователь переключает переключатель, значение элемента select изменяется на соответствующую опцию.


Также можно использовать JavaScript для установки начального значения переключателя:

1
2
3
$(document).ready(function() {
  $("#flip-1").val("on").flipswitch("refresh");
});


Этот код устанавливает значение переключателя на "Включено" и обновляет его, чтобы изменения были видны пользователю.

Пользователь

от olen.shanahan , 2 года назад

@bart 

Для создания переключателя в jQuery Mobile можно использовать следующий код:

1
2
3
4
5
<label for="toggle">Toggle switch:</label>
<select name="toggle" id="toggle" data-role="slider">
   <option value="off">Off</option>
   <option value="on">On</option>
</select>


Здесь мы используем <select> элемент, который поддерживает опцию data-role="slider", чтобы создать переключатель. Не забудьте добавить соответствующие опции внутри <select>.