Средний
10 уроков
(1 час 4 минуты)
Курс
jQuery mobile
Данный видеокурс посвящен jQuery Mobile — веб-фреймворку, который также известен как мобильный фреймворк. Разработка сфокусирована на кроссбраузерности с уклоном в сторону смартфонов и планшетов.

#6 — Динамическое создание элементов.

В этом видеоуроке рассмотрим работу с динамическими элементами в jQuery Mobile.
Фреймворк представляет собой API-интерфейс, который помогает управлять содержимым страниц. С его помощью можно взаимодействовать с динамическими элементами страницы, а также изменять глобальные настройки конфигурации фреймворка.

Mobile init — собственное событие jQuery Mobile для приложений

jQuery Mobile предоставляет новое, своё собственное событие для приложений — mobile init, которое генерируется, когда платформа полностью загружена и готова к инициализации кода. В контексе данного события могут изменяться параметры фреймворка для более тонкой настройки приложения. Например, можно задать особое поведение для прокрутки страницы или добавить свой css-класс для кнопок проекта, использовать стилизацию для переходов между страницами. Для корректной работы, событие должно быть расположено в особом месте страницы — после подключения библиотеки jQuery и перед подключением фреймворка jQuery Mobile.

Виджеты jQuery Mobile

Для реализации различных интерфейсных и функциональных решений платформа использует артихектуру виджетов. Виджеты — это элементы с html-атрибутом date-role и набором свойств/методов для взаимодействия с этими элементами. Например, это специальные кнопки, списки элементов, всплывающие окна и многие другие. Полный список виджетов и их параметров можно найти на официальном сайте jQuery Mobile.

Что создадим мы на нашем видеоуроке и для чего нам нужен localStorage

Для нашего учебного приложения создадим страницу со списком всех созданных записей. Страница будет содержать кнопку перехода на главную страницу, кнопку создания новой записи с простой формой и текстовыми полями для ввода значений. Список записей будет представлять собой набор элементов с возможностью перехода на страницу, детального просмотра записи и кнопкой удаления отдельной заметки.

Для взаимодействия с заметками будем использовать localStorage, специальный интерфейс, который предоставляет любой современный браузер, для хранения временных данных. Для обеспечения функционала списка заметок будут написаны специальные модули.

Модуль создания новой записи будет исполняться в момент события передачи данных из формы новой записи, и будет подготавливать и записывать данные в localStorage. Второй модуль будет обеспечивать функционал списка записей: отображение всех записей, просмотр детальной страницы записи и удаление конкретной записи из списка. Оба модуля должны быть инициализированы после события загрузки страницы и всех необходимых JavaScript-компонентов.

Приятного всем просмотра! Учитесь с удовольствием!

https://youtu.be/PjH6-hJRUdE — валидация форм своими руками
https://youtu.be/FbCRHHir4_c — javascript шаблонизация для чайников
https://github.com/andrIvash/quote-me.git — тестовое приложение курса

Материалы к уроку:
Делись:

Оставь комментарий!

Добавить комментарий

Рекомендуемые курсы