Виджет Buttonsetверсия добавлена: 1.8, устаревшая: 1.12
Описание: Темабельные наборы кнопок.
Этот виджет устарел, используйте Controlgroup вместо него.
.buttonset() поставляется вместе с .button(). Несмотря на то, что это отдельные виджеты, они объединены в один файл. Если у вас есть .button(), у вас также есть .buttonset().Набор кнопок обеспечивает визуальную группировку связанных кнопок. Рекомендуется использовать набор кнопок всякий раз, когда у вас есть группа связанных кнопок. Наборы кнопок работают, выбирая все соответствующие потомки и применяя к ним .button(). Вы можете включить и выключить набор кнопок, что включит и выключит все содержащиеся кнопки. Удаление набора кнопок также вызывает метод .destroy() каждой кнопки. Для сгруппированных радио и флажковых кнопок рекомендуется использовать fieldset с legend для предоставления доступного метки группы.
Тема
Виджет Buttonset использует фреймворк CSS jQuery UI для стилизации своего внешнего вида. Если необходима специфическая стилизация для Buttonset, можно использовать следующие имена CSS-классов для переопределений или в качестве ключей для classes параметра:
-
ui-buttonset: Внешний контейнер Buttonset.
Зависимости
Дополнительные примечания:
- Для работы этого виджета требуется функциональный CSS. Если вы создаёте собственную тему, используйте специфичный CSS-файл виджета в качестве отправной точки.
Параметры
disabled
false true.Инициализируйте набор кнопок с заданным параметром disabled:
$( ".selector" ).buttonset({
disabled: true
}); Получите или задайте параметр disabled после инициализации:
// Getter var disabled = $( ".selector" ).buttonset( "option", "disabled" ); // Setter $( ".selector" ).buttonset( "option", "disabled", true );
items
"button, input[type=button], input[type=submit], input[type=reset], input[type=checkbox], input[type=radio], a, :data(ui-button)" Инициализируйте набор кнопок с заданным параметром items:
$( ".selector" ).buttonset({
items: "button, input[type=button], input[type=submit]"
}); Получите или задайте параметр items после инициализации:
// Getter var items = $( ".selector" ).buttonset( "option", "items" ); // Setter $( ".selector" ).buttonset( "option", "items", "button, input[type=button], input[type=submit]" );
Методы
destroy()Возвращает: jQuery (только для плагина)
- Этот метод не принимает аргументы.
Вызовите метод destroy:
$( ".selector" ).buttonset( "destroy" );
disable()Возвращает: jQuery (только для плагина)
- Этот метод не принимает аргументы.
Вызовите метод disable:
$( ".selector" ).buttonset( "disable" );
enable()Возвращает: jQuery (только для плагина)
- Этот метод не принимает аргументы.
Вызовите метод enable:
$( ".selector" ).buttonset( "enable" );
instance()Возвращает: Объект
Получает объект экземпляра набора кнопок. Если элемент не имеет связанного экземпляра, возвращается undefined.
В отличие от других методов виджета, instance() можно безопасно вызывать для любого элемента после загрузки плагина buttonset.
- Этот метод не принимает аргументы.
Вызовите метод instance:
$( ".selector" ).buttonset( "instance" );
option( optionName )Возвращает: Объект
Получает значение, связанное с указанным optionName.
Примечание: Для параметров, значениями которых являются объекты, вы можете получить значение конкретного ключа, используя обозначение точек. Например, "foo.bar" получит значение свойства bar параметра foo.
- optionNameТип: СтрокаИмя параметра для получения.
Вызовите метод:
var isDisabled = $( ".selector" ).buttonset( "option", "disabled" );
option()Возвращает: Объект
- Этот метод не принимает аргументы.
Вызовите метод:
var options = $( ".selector" ).buttonset( "option" );
option( optionName, value )Возвращает: jQuery (только для плагина)
Устанавливает значение параметра buttonset, связанного с указанным optionName.
Примечание: Для параметров, значениями которых являются объекты, вы можете установить значение только одного свойства, используя обозначение точек для optionName. Например, "foo.bar" обновит только свойство bar параметра foo.
- optionNameТип: СтрокаИмя параметра для установки.
- valueТип: ОбъектЗначение для установки параметра.
Вызовите метод:
$( ".selector" ).buttonset( "option", "disabled", true );
option( options )Возвращает: jQuery (только для плагина)
- optionsТип: ОбъектКарта пар "параметр-значение" для установки.
Вызовите метод:
$( ".selector" ).buttonset( "option", { disabled: true } ); refresh()Возвращает: jQuery (только для плагина)
items.- Этот метод не принимает аргументы.
Вызовите метод refresh:
$( ".selector" ).buttonset( "refresh" );
widget()Возвращает: jQuery
jQuery содержащий элемент набора кнопок, содержащий кнопки. - Этот метод не принимает аргументы.
Вызовите метод widget:
var widget = $( ".selector" ).buttonset( "widget" );
События
create( event, ui )Тип: buttonsetcreate
Примечание: Объект ui пуст, но включён для согласованности с другими событиями.
Инициализируйте набор кнопок с заданным обработчиком create:
$( ".selector" ).buttonset({
create: function( event, ui ) {}
}); Привяжите обработчик событий к событию buttonsetcreate:
$( ".selector" ).on( "buttonsetcreate", function( event, ui ) {} ); Пример:
Простой jQuery UI Buttonset
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>buttonset demo</title>
<link rel="stylesheet" href="https://code.jquery.com/ui/1.13.3/themes/smoothness/jquery-ui.css">
<script src="https://code.jquery.com/jquery-3.7.1.js"></script>
<script src="https://code.jquery.com/ui/1.13.3/jquery-ui.js"></script>
</head>
<body>
<form>
<fieldset>
<legend>Favorite jQuery Project</legend>
<div id="radio">
<input type="radio" id="sizzle" name="project">
<label for="sizzle">Sizzle</label>
<input type="radio" id="qunit" name="project" checked="checked">
<label for="qunit">QUnit</label>
<input type="radio" id="color" name="project">
<label for="color">Color</label>
</div>
</fieldset>
</form>
<script>
$( "#radio" ).buttonset();
</script>
</body>
</html> 
