Ми збираємося зробити панель з декількома мітками. Кожен раз коли відбувається натискання на мітці, вона виділяється кольором і значення, відповідне мітці зберігається в кукі на вашому комп'ютері за допомогою браузера. Потім ви можете використовувати дві кнопки для виведення поточного значення, що зберігається в кукі, або для видалення куки.
Крім того, зверніть увагу на демо сторінку під час першого завантаження. Жодна з міток не виділена. А після того, як ви виберете одну, можна оновити демо сторінку, і мітка, виділена вами залишиться виділеною. Якщо ви видалите куки, то виділення зніметься з мітки. А після перезавантаження все мітки залишаться без виділень. Тепер розглянемо, як це працює.
Ми збираємося використовувати jQuery для управління куками, для чого буде задіяний плагін, який призначений для роботи зі сховищем куки. Назва у плагіна говорить сама за себе - Cookie.
Плагін Cookie можна завантажити з розділу проектів сайту плагінів jQuery.
Код HTML виглядає дуже просто:
створюємо куки
Отже, перше, що потрібно зробити, додати звичайний код для виконання нашого скрипта після того, як документ готовий:
Тепер ми створюємо обробник події натискання кнопки миші. Функція preventDefault () є стандартною процедурою jQuery для запобігання переходу браузера по посиланню, коли на ній натискають кнопку миші. Коли користувач натискає кнопку миші на мітці (яка насправді є посиланням), ми видаляємо клас .selected з мітки, яка виділена в поточний момент і встановлюємо його для щойно обраної.
Тепер додамо клас .selected до мітки:
Отримання і висновок значення куки
видалення куки
На закінчення, ми видаляємо куки. Це дуже цікавий момент. Код виглядає наступним чином:
І все. Розглянемо третій аргумент функції. Якщо подивитися в код плагіна jquery.cookie.js. то виявиться, що при значенні другого аргументу null змінної expires в масиві options присвоюється значення -1:
Тому, якщо ми передамо cookieOptions в якості третьої аргументу, наприклад, так:
то робота нашого коду порушиться, так як cookieOptions.expires прийме значення -1, що повністю відповідає логіці роботи плагіна.
Наш код завершується класичної кінцівкою:
5 останніх уроків рубрики "jQuery"
Сьогодні ми б хотіли вам розповісти про бібліотеку TypeIt - безкоштовному jQuery плагін. З її допомогою можна імітувати набір тексту. Якщо все налаштувати правильно, то можна домогтися дуже реалістичного ефекту.
jQuery плагін для створення тимчасової шкали.
jQuery плагін для створення діаграми Ганта.
Приклад того як здійснити завантаження файлу через PHP і jQuery ajax.
Урок як то сумбурно описаний і код погано читається через тегів
всюди. Поструктурірованее б його і по подробней. У розділі "Створюємо куки" не зрозумів навіщо ми спочатку додаємо клас selected, потім його видаляємо, а потім знову додаємо.
А взагалі спасибі. А як можна змінювати значення куки? І не погано було б додати опис всіх аргументів функції cookie.
Серьога Любинський
Що можна зробити, щоб в хромі Рабтана? Будь-урок на демо запускається. Качаю - не працює. Працює у всіх Бразер крім хрому
Підкажіть будь ласка я переправив сріпт під меню але незнаю як зробити щоб при кліці на посилання спрацьовував перехід
Відповідь Знайдений міняємо на Потрібно було видалити обробник події натискання кнопки миші. Функція preventDefault () є стандартною процедурою jQuery для запобігання переходу браузера по посиланню, коли на ній натискають кнопку миші.
Опишіть процес роботи з куками якось більш широко, щоб зберігати і показувати більше даних, ато шото незрозуміло.
danam212909
- це скільки 7 днів, 7 років, 7 разів?
За рахунок отримання інформації відразу по двох каналах (зір і слух) ефективність навчання значно перевершує навчання по книгах. А домашні завдання і онлайн-тести дозволять вам постійно думати на мові, що вивчається і відразу перевіряти свої знання!
Якщо ви давно хочете як слід вивчити HTML, то у мене для Вас є чудова новина!
Якщо ви вже вивчили HTML і хочете рухатися далі, то наступним кроком буде вивчення технології CSS.
Якщо ви хочете розібратися з поняттями домену і хостингу, навчитися створювати бази даних, закачувати файли сайту на сервер по FTP, створювати піддомени, налаштовувати поштові скриньки для свого сайту і стежити за його відвідуваністю, то цей курс створений спеціально для вас!