Компоненты, обсуждаемые в предыдущих компонентах макета раздела, являются только началом. Bootstrap поставляется с 12 плагинами jQuery, которые расширяют функции и могут добавлять больше взаимодействий на сайт. Даже если вы не являетесь разработчиком JavaScript высокого уровня, вы можете начать изучать плагин JavaScript для Bootstrap. С помощью API данных Bootstrap Data (API Data Bootstrap) большинство плагинов можно запустить без написания кода.
Есть два способа обратиться к плагину начальной загрузки на сайте :
Индивидуальная ссылка: индивидуальные *.js файлы с использованием Bootstrap. Некоторые компоненты плагинов и CSS полагаются на другие плагины. Если вы ссылаетесь на плагины отдельно, сначала не запросите зависимости между этими плагинами.
Compile (одновременный) Ссылка: используйте Bootstrap.js или сжатую версию Bootstrap.min.js.
«Не пытайтесь ссылаться на оба файла одновременно, потому что Bootstrap.js и Bootstrap.min.js оба содержат все плагины».
Все плагины зависят от jQuery. Таким образом, jQuery должен быть направлен на файл плагина. Пожалуйста, посетите Bower.json, чтобы просмотреть поддерживаемую в настоящее время версию JQUERY Bootstrap.
1. Атрибуты данных
Вы можете использовать все плагины Bootstrap только через API атрибута данных, не написав ни одной строки кода JavaScript. Это первоклассный API в начальной загрузке, который также должен быть вашим предпочтительным методом.
Опять же, эта функция, возможно, должна быть отключена в некоторых случаях. Поэтому мы также предоставляем способ закрыть API атрибута данных, то есть отменить события, которые принимают данные API в качестве пространства имен и связываются с документом. Точно так же:
$ (document) .off ('. Data-Api')
Чтобы закрыть конкретный плагин, просто добавьте имя плагина в качестве пространства имен перед пространством имен данных, как показано ниже:
$ (document) .off ('. alert.data-api')
2. Программирование API
Мы предоставляем API на основе чистого JavaScript для всех плагинов Bootstrap. Все общедоступные API поддерживают индивидуальные или цепные методы вызова и возвращают набор элементов, на которых они работают (примечание: в соответствии с формой вызова JQUERY). Например:
$ (". Btn.danger"). Кнопка ("Toggle"). addclass ("fat")Все методы могут принять необязательный объект опции в качестве параметра или строку, представляющую конкретный метод, или без каких-либо параметров (в данном случае плагин будет инициализирован как поведение по умолчанию), как показано ниже:
// Инициализировать поведение по умолчанию $ ("#mymodal"). Modal () // инициализировать, чтобы не поддерживать клавиатуру $ ("#mymodal"). Modal ({keyboard: false}) // инициализируйте и вызовите Show $ ("#mymodal"). Modal ('show')Каждый плагин также разоблачает свой первоначальный конструктор на свойстве конструктора: $ .fn.popover.constructor. Если вы хотите получить экземпляр конкретного плагина, вы можете получить его непосредственно через элемент страницы:
$ ('[rel = popover]'). data ('popover').
3. Избегайте конфликтов пространства имен
Иногда, возможно, потребуется использовать плагин для начальной загрузки с другими каркасами пользовательского интерфейса. В этом случае могут возникнуть конфликты пространства имен. Если это, к сожалению, произойдет, вы можете восстановить его исходное значение, вызвав метод. Н.Ноконфликт плагина.
// Возврат значения, назначенного до $ .fn.button var bootstrapbutton = $.
4. События
Bootstrap предоставляет пользовательские события для уникального поведения большинства плагинов. Вообще говоря, эти события бывают двух форм:
Инфинитив глагол: это будет вызвано в начале события. Например, пример: Show. Инфинитивные события глагола обеспечивают функцию предотвращения. Это позволяет выполнять операцию до остановки до начала события.
$ ('#mymodal'). on ('show.bs.modal', function (e) {// Предотвратить отображение модальных поксов, если (! data) return e.preventdefault ()})Прошлая форма причастия: это будет вызвано после выполнения действия. Например, пример: Show.
Выше приведено простой обзор плагина Bootstrap. Я надеюсь, что для всех будет полезно понять плагин Bootstrap.