Contents — Professional jQuery [книга]
Contents — Professional jQuery [книга]Перейти к основному содержанию
Получите полный доступ к Professional jQuery и более чем 60 000 других игр с бесплатной 10-дневной пробной версией O’Reilly.
Есть также прямые трансляции, курсы, созданные по должностям, и многое другое.
Начать бесплатную пробную версию
СОДЕРЖАНИЕ
Часть I. Основы jQuery
Глава 1. Начало работы
Чем хорош jQuery
Требования к оборудованию и браузеру
Получение jQuery и пользовательского интерфейса jQuery
Пример «Hello World»
Соглашения JavaScript, используемые в этой книге
Инструменты разработки Плагин FireQuery
Резюме
Глава 2: Javascript Primer
Понимание чисел
Работа со строками
Понимание логических выражений
Типы сравнения
Краткое примечание о датах
Обзор различных типов
Повторный просмотр переменных
Понимание объектов
Использование функций
Понимание контекста выполнения
Работа с областью действия и замыканиями
Понимание уровней доступа
Применение модулей
Использование массивов JavaScript
Расширение типов
Применение лучших практик JS
Собираем все вместе
Резюме
Примечание
Глава 3: Ядро jQuery
Понимание структуры скрипта jQuery
Ненавязчивое использование JavaScript
Структура jQuery Framework
Понимание DOM и событий
Использование jQuery с другими Библиотеки JavaScript
Сводка
Примечания
Глава 4. Выбор элементов DOM и управление ими
Возможности селекторов jQuery
Выполнение обхода DOM
Доступ и изменение элементов, атрибутов и содержимого
Генерация HTML
Сводка
Глава 5. Обработка событий
Понимание модели событий браузера
Понимание того, как jQuery обрабатывает события
Применение обработчиков событий jQuery
Работа с События
Новый API событий JQuery
Сводка
Примечания
Глава 6: Html-формы, данные и Ajax
Оценка данных jQuery
Использование проверок форм
Работа с элементами HTML-форм
Повторение основ Ajax
Применение Ajax с помощью …
Получите Professional jQuery прямо сейчас с обучающей платформой O’Reilly.
члена O’Reilly знакомятся с книгами, живыми мероприятиями, курсами, созданными в зависимости от должности, и многим другим от O’Reilly и почти 200 ведущих издателей.
Начать бесплатную пробную версию
Не оставляйте с пустыми руками
Получите электронную книгу Марка Ричардса Software Architecture Patterns , чтобы лучше понять, как проектировать компоненты и как они должны взаимодействовать.
Это твое, бесплатно.
Получить сейчасПроверьте это прямо сейчас на O’Reilly
Получите бесплатную 10-дневную пробную версию обучающей платформы O’Reilly, а затем изучите все другие ресурсы, на которые наши участники рассчитывают, чтобы развивать навыки и решать проблемы каждый день.
jQuery Mobile Docs — Сворачиваемое содержимое
Сворачиваемое содержимое
- Основы
- Опции
- Методы
- События
Чтобы создать сворачиваемый блок контента, создайте контейнер и добавьте атрибут data-role="collapsible"
. Использование атрибута data-content-theme
позволяет установить тему для содержимого складного объекта. Просмотрите справку по атрибутам данных, чтобы увидеть все возможные атрибуты, которые вы можете добавить к складным элементам.
Непосредственно внутри этого контейнера добавьте любой элемент заголовка (h2-H6). Фреймворк стилизует заголовок так, чтобы он выглядел как нажимаемая кнопка, и добавит значок «+» слева, чтобы указать, что он расширяемый.
После заголовка добавьте любую HTML-разметку, которую вы хотите свернуть. Фреймворк поместит эту разметку в контейнер, который будет скрыт/отображен при нажатии на заголовок.
По умолчанию содержимое будет свернуто.
data-role="складной" >Я заголовок
Я сворачиваемый контент. По умолчанию я закрыт, но вы можете нажать на заголовок, чтобы открыть меня.
Я жатка
Я складной контент. По умолчанию я закрыт, но вы можете щелкнуть заголовок, чтобы открыть меня.
Раскрытие складных элементов при загрузке
Чтобы расширить содержимое при загрузке страницы, добавьте атрибут data-collapsed="false"
в оболочку.
data-collapsed="false"> Этот код создаст сворачиваемый виджет, например:
Я заголовок
Я сворачиваемый контент. Я развернут по умолчанию, потому что для меня установлено состояние «свернутое» на false.
Мини-складные элементы
Для более компактной версии, которая будет полезна на панелях инструментов и в ограниченном пространстве, добавьте к элементу атрибут data-mini="true"
, чтобы создать мини-версию.
data-mini="true"> Этот код создаст мини-складной виджет:
Я мини-заголовок
Я сворачиваемое содержимое. Я развернут по умолчанию, потому что для меня установлено состояние «свернутое» на false.
Положение значка
Положение значка по умолчанию для складных заголовков можно переопределить с помощью атрибута data-iconpos
. В приведенном ниже случае data-iconpos="right"
.
Я заголовок
data-iconpos="right"
Тематическое оформление сворачиваемого содержимого
Сворачиваемое содержимое имеет минимальные стили — мы добавляем лишь небольшой отступ между панелью и содержимым, а заголовок принимает значение по умолчанию Стили темы контейнера, в котором он находится.
Чтобы обеспечить более сильную визуальную связь между сворачиваемым заголовком и содержимым, добавьте к оболочке атрибут data-content-theme
и укажите букву образца темы. Это применит рамку образца и плоский цвет фона (не градиент) к блоку содержимого и изменит закругление угла на квадратное в нижней части заголовка и закруглит нижнюю часть блока содержимого, вместо того, чтобы визуально сгруппировать эти элементы.
data-content-theme="c" >
Образец заголовка A
Я сворачивающийся контент с тематическим блоком контента, установленным на "C".
Образец заголовка
Я — сворачиваемое содержимое с тематическим блоком содержимого, установленным на «C».
Тематическое оформление сворачиваемых заголовков
Чтобы задать тему для кнопки сворачиваемого заголовка, добавьте в оболочку атрибут data-theme
и укажите букву образца. Обратите внимание, что вы можете смешивать и сопоставлять образцы букв между заголовком и содержимым с помощью этих атрибутов темы.
data-theme="a" data-content-theme="a" >
Образец заголовка A
Я сворачивающийся контент с тематическим блоком контента, для которого установлено значение "A".
Образец заголовка A
Я — сворачиваемое содержимое с тематическим блоком содержимого, установленным на «A».
Образец заголовка B
Я — сворачиваемое содержимое с блоком тематического содержимого, для которого установлено значение «D».
Вложенные складные элементы
Складные элементы при необходимости могут быть вставлены друг в друга. В этом примере мы настраиваем тему контента, чтобы обеспечить более четкую визуальную связь между уровнями.
Я заголовок
Я складной контент. По умолчанию я открыт и отображается на странице, но вы можете щелкнуть заголовок, чтобы скрыть меня.
Я вложенная разборная с дочерней разборной
Я дочерняя разборная.
Снова вложен внутрь.