Блок служит для загрузки и подключения на страницу библиотеки jQuery и ее расширений. Расширения подключаются через зависимости от элементов блока.
modules.require(['jquery'], function($) {
console.log($);
});
Элемент | Способы использования | Описание |
---|---|---|
config | JS |
Настройки jQuery. |
event | JS |
Расширения событийной модели jQuery. |
Элемент | Имя | Тип или возвращаемое значение | Описание |
---|---|---|---|
config | url | {String} |
Строка с URL, подключаемой библиотеки jQuery. |
Элемент | Имя | Описание |
---|---|---|
event | pointerclick | Позволяет избавиться от задержки события click на тач-устройствах. |
pointerover | Генерируется, когда указатель устройства ввода находится над элементом. | |
pointerenter | Генерируется при входе указателя в активную зону элемента. | |
pointerdown | Генерируется при входе устройства ввода в состояние активного нажатия. | |
pointermove | Генерируется при изменении координат указателя. | |
pointerup | Генерируется по выходу из состояния активного нажатия. | |
pointerout | Генерируется когда указатель покидает зону над элементаом. | |
pointerleave | Генерируется при выходе указателя из активной зоны элемента. | |
pointerpress | Генерируется по событию pointerdown . |
|
pointerrelease | Генерируется по событиям pointerup и pointercancel . |
|
pointercancel | Генерируется в случаях, когда не предполагается дальнейшее возникновение pointer-событий или после генерации события pointerdown . |
Блок реализован в технологиях:
js
config
блока jquery
Элемент предоставляет объект с настройками подключаемой библиотеки jQuery. Настройки хранятся как свойства объекта.
url
Тип: {String}
.
Содержит строку с URL для загрузки jQuery. В проекте значение свойства может быть переопределено. Тогда при подключении блока будет использовано новое значение, если библиотека jQuery не была подключена предварительно.
modules.define('jquery__config', function(provide) {
provide({ url: '//foo.bar/my-custom-jquery.js' });
});
event
блока jquery
Элемент реализует поддержку дополнительных типов событий jQuery. Дополнительные типы подключаются с помощью соответствующих значений модификатора type
.
type
Предоставляет набор полифилов, реализующих уровень абстракции над jQuery-событиями устройств ввода. Это позволяет создавать общую логику для различных платформ (десктопы, телефоны и т.д.) и дополнять ее методами, специфическими для конкретного вида устройств.
Каждый полифил добавляет набор pointer-событий, для создания аппаратно-независимой логики.
Все pointer-события являются пользовательскими событиями jQuery. Подписка на pointer-события осуществляется стандартным образом:
modules.define(
'pointer-test',
['i-bem__dom', 'jquery'],
function(provide, BEMDOM, $) {
provide(BEMDOM.decl({ block : this.name }, /** @lends pointer-test.prototype */ {
onSetMod : {
'js' : {
'inited' : function() {
this.bindTo('pointerpress', this.onPress); // при инициализации подписываемся на pointerpress на самом блоке
}
}
},
onPress : function(e) {
console.log(e.type);
this.bindTo('pointerrelease', this.onRelease); // при вызове обработчика для pointerpress подписываемся на pointerrelease
},
onRelease : function(e) {
console.log(e.type);
this.unbindFrom('pointerrelease', this.onRelease); // при вызове обработчика для pointerrelease отписываемся от pointerrelease
}
}));
});
В зависимости от значения модификатора, будут подключены разные полифилы.
type
в значении pointer
Модификатор для подключения всех типов pointer-событий. Не вводит дополнительной логики.
type
в значении pointerclick
Подключает полифил, реализующий событие pointerclick
.
pointerclick
Генерируется по нажатию левой клавиши мыши или в момент контакта с рабочей поверхностью устройства. Использование pointerclick
позволяет избавиться от задержки события click
на тач-устройствах.
type
в значении pointernative
Подключает полифил, реализующий базовую функциональность модели W3C Pointer Events.
С модификатором доступен следующий набор событий:
pointerover
Генерируется в момент:
pointerdown
, для устройств, не поддерживающих hover
.pointerenter
Генерируется:
pointerdown
для устройств, не поддерживающих hover
.Событие аналогично pointerover
, но не всплывает.
pointerdown
Генерируется в момент, когда устройство ввода входит в состояние активного нажатия:
pointermove
Генерируется при изменении координат указателя.
pointerup
Генерируется по выходу из состояния активного нажатия:
pointerout
Генерируется при выходе указателя из активной зоны элемента:
pointerup
и pointercancel
для устройств, не поддерживающих hover
. Например, когда стилус (палец) покидает рабочую зону устройства.pointerleave
Генерируется при выходе указателя из активной зоны элемента:
pointerup
и pointercancel
для устройств, не поддерживающих hover
.Событие аналогично pointerout
, но не всплывает.
pointercancel
Генерируется в случаях, когда:
pointerdown
, если указатель был использован для масштабирования страницы.Например, событие генерируется при изменении ориентации устройства пока оно находится в состояние активного нажатия. Или при превышении лимита на количество одновременных нажатий, поддерживаемых устройством.
После генерации события pointercancel
последовательно генерируются события pointerout
и pointerleave
.
type
в значении pointerpressrealease
Подключает полифил, реализующий события pointerpress
и pointerrelease
. Полифил использует события Pointer Events.
pointerpress
Генерируется по событию pointerdown
.
pointerrelease
Генерируется по событиям pointerup
и pointercancel
.