Начало работы

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

JavaScript

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

Содержание

Индивидуальный или составленный

Плагины могут быть включены отдельно (используя индивидуальные *.js файлы Bootstrap) или все сразу с помощью bootstrap.js или минифицированного bootstrap.min.js (не включая оба).

Зависимости

Некоторые плагины и компоненты CSS зависят от других плагинов. Если вы включаете плагины по отдельности, не забудьте проверить эти зависимости в документах. Также обратите внимание, что все плагины зависят от jQuery (это означает, что jQuery должен быть включен перед файлами плагина). Обратитесь к нашему bower.json чтобы узнать, какие версии jQuery поддерживаются.

Атрибуты данных

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

Однако в некоторых ситуациях может быть желательно отключить эту функцию. Чтобы отключить API-атрибут данных, отмените привязку всех событий в именах документов, помеченных как data-api следующим образом:

$(document).off('.data-api')

В качестве альтернативы, чтобы настроить таргетинг на определенный плагин, просто включите имя плагина в качестве пространства имен вместе с пространством имен data-api следующим образом:

$(document).off('.alert.data-api')

Программный API

Мы также полагаем, что у вас должна быть возможность использовать все плагины Bootstrap исключительно через JavaScript API. Все общедоступные интерфейсы API являются едиными, цепочечными методами и возвращают коллекцию, на которую действуют.

$('.btn.danger').button('toggle').addClass('fat')

Все методы должны принимать необязательный объект параметров, строку, которая нацелена на конкретный метод, или ничего (который инициирует плагин с поведением по умолчанию):

$('#myModal').modal()                      // initialized with defaults
$('#myModal').modal({ keyboard: false })   // initialized with no keyboard
$('#myModal').modal('show')                // initializes and invokes show immediately

Каждый плагин также предоставляет свой исходный конструктор в свойстве Constructor: $.fn.popover.Constructor. Если вы хотите получить конкретный экземпляр плагина, извлеките его непосредственно из элемента: $('[rel="popover"]').data('popover').

Настройки по умолчанию

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

$.fn.modal.Constructor.DEFAULTS.keyboard = false // changes default for the modal plugin's `keyboard` option to false

Нет конфликта

Иногда необходимо использовать плагины Bootstrap с другими инфраструктурами пользовательского интерфейса. В этих обстоятельствах могут возникать конфликты пространства имен. Если это произойдет, вы можете вызвать .noConflict для плагина, для которого вы хотите вернуть значение.

var bootstrapButton = $.fn.button.noConflict() // return $.fn.button to previously assigned value
$.fn.bootstrapBtn = bootstrapButton            // give $().bootstrapBtn the Bootstrap functionality

События

Bootstrap предоставляет настраиваемые события для уникальных действий большинства плагинов. Как правило, они входят в форму инфинитива и прошлого причастия - где инфинитив (например, show) запускается в начале события, а его причастная форма прошедшего времени (например, shown) запускается по завершении действия.

Все инфинитивные события обеспечивают функциональность preventDefault(). Это дает возможность остановить выполнение действия до его запуска.

$('#myModal').on('show.bs.modal', function (e) {
  if (!data) return e.preventDefault() // stops modal from being shown
})

Номера версий

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

$.fn.tooltip.Constructor.VERSION // => "4.0.0-alpha.6"

Нет специальных резервных копий, когда JavaScript отключен

<noscript> чтобы объяснить ситуацию (и как повторно включить JavaScript) для ваших пользователей и/или добавить собственные резервные копии.

Сторонние библиотеки

Bootstrap официально не поддерживает сторонние библиотеки JavaScript, такие как Prototype или jQuery UI. Несмотря на события .noConflict и события с именами, могут возникать проблемы совместимости, которые необходимо исправить самостоятельно.

Переходы

Для простых эффектов перехода включите transition.js один раз рядом с другими файлами JS. Если вы используете скомпилированный (или сокращенный) bootstrap.js, нет необходимости включать это - оно уже есть.

Transition.js - это базовый помощник для событий transitionEnd а также эмулятор перехода CSS. Он используется другими плагинами, чтобы проверить поддержку перехода CSS и поймать висячие переходы.

Комментарии

На сайте функционирует система проверки ошибок. Обнаружив неточность в тексте, выделите ее и нажмите Ctrl + Enter.

Поддержать проект

x