Партнерка на США и Канаду по недвижимости, выплаты в крипто
- 30% recurring commission
- Выплаты в USDT
- Вывод каждую неделю
- Комиссия до 5 лет за каждого referral
В JavaScript каждое событие порождает ассоциированный с ним объект event. Этот объект содержит всю информацию о событии и его можно передать процедуре обработки события.
Информация о событии зависит от конкретного произошедшего события. Например, объект event события MouseDown содержит информацию о типе события (свойство type), какая кнопка мыши была нажата (свойство which), какая клавиша (Alt, Shift или Ctrl) удерживалась при щелчке кнопкой мыши (свойство modifiers), и значения координат курсора мыши в момент возникновения события (свойства screenX и screenY). Объекты event совместно с обработчиками событий позволяют проводить достаточно тонкую обработку события.
Свойство | Описание |
srcElement | Позволяет узнать источник события. Например, srcElement. tagName дает имя тэга, описывающего данный элемент. |
type | Строка, содержащая тип события |
clientX | Число, указывающее горизонтальную координату события в клиентских координатах («область клиента» окна браузера без рамки, меню и т. д.) |
clientY | Число, указывающее вертикальную координату события в клиентских координатах («область клиента» окна браузера без рамки, меню и т. д.) |
screenX | Число, указывающее горизонтальную координату события относительно окна |
screenY | Число, указывающее вертикальную координату события относительно окна |
offsetX | Число, указывающее горизонтальную координату события относительно контейнера (левого верхнего угла элемента, получившего событие) |
offsetY | Число, указывающее вертикальную координату события относительно контейнера (левого верхнего угла элемента, получившего событие) |
x | Число, указывающее горизонтальную координату события относительно верхнего левого угла первого абсолютно или относительно позиционированного контейнера, в котором находится элемент, получивший событие |
y | Число, указывающее вертикальную координату события относительно верхнего левого угла первого абсолютно или относительно позиционированного контейнера, в котором находится элемент, получивший событие |
button | Число, указывающее нажатую кнопку мыши |
keyCode | Код нажатой клавиши |
altKey, ctrlKey, shiftKey | Булево значение, соответствующее типу нажатой клавиши – Alt, Ctrl или Shift |
cancelBubble | Булево значение, указывающее, передается событие по иерархии объектов или нет |
returnValue | Позволяет запретить или разрешить выполнение действий, приписанных элементу |
Пример:
<HTML><HEAD><TITLE>Event</TITLE>
<SCRIPT LANGUAGE="JavaScript">
<!--
function PressKey()
{
alert('Код клавиши= '+event. keyCode)
}
-->
</SCRIPT>
</HEAD>
<body bgcolor="WHITE" onKeyDown="PressKey(event)" >
<H3>Демонстрация свойств и методов объекта EVENT</H3>
</body>
</HTML>
Вызов процедуры обработки события
Вызов процедуры обработки события можно осуществить двумя способами:
· явно – назначив ссылку на процедуру обработки события в соответствующем свойстве объекта;
· неявно – в параметре обработки события тэга соответствующего элемента.
Каждый объект JavaScript, создаваемый для элемента HTML-документа, имеет свойства, ассоциированные с возможными событиями, которые могут быть сгенерированы для этого элемента. Присвоив этому свойству в качестве значения ссылку на процедуру обработки события, мы, тем самым, определим процедуру, которая будет вызываться при возникновении соответствующего события:
<FORM NAME=”form1”>
<INPUT TYPE=”button” NAME=”btn1” VALUE=”Узнай событие”>
<SCRIPT>
document. form1.btn1.onmousedown = showEventType
</SCRIPT>
</FORM>
Сама процедура задается следующим кодом:
function showEventType(e)
{ alert(“Произошло событие: ” + e. type) }
Обратим внимание на то, что, присваивая ссылку на процедуру, мы не задаем в скобках никаких параметров. Это связано с тем, что любая процедура в JavaScript представляется как объект. Поэтому указание имени процедуры (объекта) однозначно определяет ссылку на нее. В объявлении функции showEventType присутствует параметр e, свойство type которого выводится в диалоговом окне. При явном вызове процедуры обработки события объект event передается ей по умолчанию, поэтому в данном случае печатается значение свойства type объекта event, т. е. тип события – MouseDown.
Второй неявный вызов процедуры обработки события требует задания обращения к ней в параметре onMouseDown тэга <INPUT>. При этом необходимо явно указывать параметр event:
<FORM NAME=”form1”>
<INPUT TYPE=”button” NAME=”btn1” VALUE=”Узнай событие” onMouseDown = “showEventType(event)”>
</FORM>
2.4 Cookie
Проще всего представить себе Cookie как набор строковых параметров, каждый из которых имеет имя и значение. Клиентский сценарий может создавать Cookie для документов HTML, определяя в нем произвольное количество параметров и задавая для них произвольные значения. Далее такой набор параметров становится принадлежностью данного конкретного документа HTML и может быть проанализирован, изменен или удален сценарием.
Основное, для чего нужен Cookie, - это предоставление пользователю возможности настроить «под себя» интерфейс интерактивных документов HTML. Эти параметры могут анализироваться или не анализироваться Web-сервером, но в любом случае они хранятся у пользователя.
Конечно, задачу индивидуальной настройки параметров страниц можно решить и другими способами, например, при помощи ASP или расширений Web-сервера – типа программ CGI. Для этого на сервере надо установить базу данных, хранящую параметры для всех зарегистрированных в ней пользователей. В этом случае расширения Web-сервера способно динамически создавать настраиваемые документы HTML, используя для определения внешнего вида страниц параметры, хранящиеся в базе данных.
Возлагая задачу хранения параметров отдельных документов на пользовательский браузер, можно сильно упростить задачу организации настройки диалогового интерфейса. А для этого как раз и могут быть использованы Cookie и клиентские сценарии.
Еще одно практическое применение Cookie – хранение товара, выбранного посетителем Интернет-магазина. Покупатель отмечает разный товар на разных страницах сервера. При этом полный заказ вначале сформирован и сохранен в Cookie, а затем по явному запросу пользователя переправляется на сервер.
Среди других применений можно отметить сетевые игры. В Cookie может храниться, например, текущее состояние игры или другие параметры.
Конечно, у технологии Cookies есть недостатки. Первый из них – не все браузеры поддерживают Cookies (пользователи часто имеют обыкновение отключать поддержку Cookies – якобы для большой безопасности). Второй недостаток заключается в том, что каждый браузер хранит свои Cookies отдельно. Т. е. Cookies, установленные при пользовании IE, не будут «видны» при работе с NN, и наоборот.
2.4.1 Создание Cookie
Можно выделить два способа создания Cookie: расширениями Web-сервера и клиентскими сценариями.
Создание Cookie расширениями Web-сервера. Для того чтобы создать Cookie первым способом, расширение Web-сервера обычно добавляет в заголовок HTTP динамически создаваемого документа HTML поле с именем Set-Cookie. В нем определяются имена и значения параметров Cookie.
Когда расширение Web-сервера вызывается из документа HTML, имеющего Cookie, параметры Cookie передаются этому расширению через поле Cookie заголовка HTTP и могут быть проанализированы.
Заголовок HTTP, предназначенный для создания Cookie, выглядит следующим образом:
Set-Cookie name=value; expires=date; domain=host; path=address; secure
Описание отдельных полей заголовка Set-Cookie приведено в таблице.
Поле | Описание |
name | Произвольное имя, закрепленное за Cookie. Имя должно быть URL-кодированным текстом, т. е. состоять только из алфавитно-цифровых символов. Впрочем, обычно имена для Cookies выбираются имена так, чтобы URL-кодированная форма совпадала с оригиналом. |
value | Текст, который будет рассматриваться как значение Cookie. Важно отметить, что этот текст (ровно как и строка названия Cookie) не должен содержать пробелов, запятых и двоеточий, поэтому надо использовать для него URL-кодировку. |
expires | пара expires=date задает время жизни Cookie по Гринвичу. Точнее, Cookie самоуничтожается, как только наступит указанная дата. Например, если задать expires=Friday, 31-Dec-99 23:59:59 GMT, то Cookie будет жить только до 31 декабря 1999 года. А если нам нужно вычислять дату самоуничтожения на основе текущего времени? Тогда придется создавать функцию, которая формировала бы календарную дату в указанном выше формате. (Если параметр не указан, то временем жизни будет считаться вся текущая сессия работы браузера, до того момента, как пользователь его закроет). |
domain | Параметр domain=host задает имя хоста, с которого установили Cookie. |
path | Параметр path=address обычно описывает каталог (точнее URL), в котором расположен сценарий, установивший Cookie. |
secure | Этот параметр связан с защищенным протоколом передачи HTTPS. Если указано это поле, данные Cookie необходимо передавать только и использованием защищенного протокола SSL. |
Небольшое замечание относительно полей domain и path, определяющих условие, при котором выполняется установка Cookie.
Когда браузер загружает документ HTML с Web-сервера и среди заголовков HTTP этого документа есть заголовок Set-Cookie, он проверяет возможность установки Cookie. В процессе проверки анализируется адрес URL, откуда был загружен этот документ, а также содержимое полей domain и path.
Если эти поля не указаны, то по умолчанию считается, что они соответствуют адресу URL, по которому находится загруженный документ HTML. В этом случае выполняется установка Cookie.
Когда же указано поле domain, установка Cookie выполняется, только если документ загружен с Web-сервера, принадлежащего данному домену.
Средствами параметра path можно установить ограничение на адреса URL в рамках домена, для которых выполняется установка Cookie. При этом значение «/» соответствует всем адресам данного домена.
Одновременно Web-сервер способен создать несколько параметров Cookie, включив в заголовок документа HTML несколько заголовков Set-Cookie.
Следует отметить, что существует и другой подход активизировать Cookie – при помощи HTML-тэга <META>. Соответственно, как только браузер увидит такой тэг, он займется обработкой Cookie. Формат тэга такой:
<META HTTP-EQUIV=”Set-Cookie” CONTENT=”name=value; expires=date; domain=host; path=address; secure”>
Создание Cookie в клиентском сценарии. Второй способ предполагает использование свойства document. cookie. В общем виде сценарий создает Cookie следующим образом:
document. cookie = “name=value”;
Здесь просто записывается в свойство cookie объекта document текстовая строка, определяющая Cookie.
В качестве примера ниже показан исходный текст функции addCookie, которая может быть использована для создания Cookie.
function addCookie(szName, szValue, dtDaysExpires)
{
var dtExpires = new Date();
var dtExpiryDate = "";
dtExpires. setTime(dtExpires. getTime() +
dtDaysExpires * 24 * 60 * 60 * 1000);
dtExpiryDate = dtExpires. toGMTString();
document. cookie = szName + "=" +
szValue + "; expires=" + dtExpiryDate;
}
Функция addCookie получает три параметра.
Через параметр szName передается имя параметра, хранящегося в Cookie. Параметр szValue определяет значение этого параметра Cookie. Что же касается последнего параметра - dtDaysExpires, то он задает интервал времени в сутках по отношению к моменту создания Cookie, когда этот Cookie необходимо удалить.
Самое сложное в функции addCookie – это определение даты удаления Cookie и преобразование этой даты в формат GMT. Данная задача может быть решена следующим образом.
Прежде всего, функция addCookie создает объект класса Data с помощью ключевого слова new:
var dtExpires = new Date();
Записанная таким образом в переменную dtExpires дата соответствует моменту вызова функции addCookie.
Далее с помощью метода getTime функция addCookie определяет текущую дату в миллисекундах и прибавляет к результату значение параметра dtDaysExpires, передаваемое функции при ее вызове, умноженное на константу (24*60*60*1000):
dtExpires. getTime() + dtDaysExpires * 24 * 60 * 60 * 1000
Константа - это количество часов в сутках умноженное на количество минут в часе, затем на количество секунд в минуте и, наконец, на количество миллисекунд в секунде.
Результат вычислений записывается при помощи метода setTime в переменную даты dtExpires. Теперь здесь хранится дата автоматизированного уничтожения Cookie браузером. Осталось лишь преобразовать эту дату в формат GMT.
Такое преобразование нетрудно сделать с помощью специально предназначенного для этого метода toGMTString, возвращающего текстовую строку в нужном формате:
dtExpiryDate = dtExpires. toGMTString();
Теперь остается только сформировать текстовую строку определения Cookie и записать ее в свойство document. cookie:
document. cookie =
szName + "=" + escape(szValue) + "; expires=" + dtExpiryDate;
Отметим, что функция escape(szValue) применяет HTML-кодировку к строке, задающей значение Cookie.
На этом создание Cookie завершено.
Например, в следующей строке сценарий создает Cookie с именем Count и значением 6, причем через 7 дней этот Cookie будет автоматически удален:
addCookie(“Count”, “6”, 7)
2.4.2 Получение значения Cookie
Нахождение значения Cookie сводится к простому сканированию текстовой строки, полученной следующим образом:
var szCookieString = document. cookie
В этой строке нужно найти подстроку «name=value;», а затем извлечь необходимое значение. Это можно организовать, создав функцию findCookie(), которая будет осуществлять циклический просмотр всех символов этой строки. Условием завершения цикла является просмотр всех символов, количество которых составляет szCookieString. length.
Сравнивая имя параметра с подстрокой, извлеченной из строки szCookieString с помощью метода substring, можно найти нужный параметр. Если попытка оказывается успешной, функция должна пропустить символ присваивания, извлекая значение параметра, ограниченное точкой с запятой.
Если же поиск неудачен, функция возвращает пустую строку.
С помощью такой функции можно проверить, установлен ли для данного документа Cookie с заданным именем. Например:
if(findCookie(“Visit”) == “”)
{
// Cookie с именем Visit установлен
…
}
else
{
// Cookie с именем Visit не установлен
…
}
Для того чтобы записать в текстовую переменную значение параметра Cookie с заданным именем, следует сделать следующее:
var szVisitValue = findCookie(“Visit”);
2.4.3 Изменение значения параметра Cookie и его удаление
Для изменения значения параметра Cookie с заданным именем можно просто вызвать функцию addCookie еще раз:
addCookie(“Count”, “0”, 7;
// Значение параметра Count равно 0
Самый простой способ удалить Cookie – установить для него такое время автоматического удаления, которое уже прошло. Для этого нужно получить текущую дату, уменьшить ее, например, на одну микросекунду, а затем изменить значение document. cookie. Это может быть сделано, например, с помощью функции removeCookie:
function removeCookie(szName)
{
var dtExpires = new Date();
dtExpires. setTime(dtExpires. getTime() - 1);
var szValue = findCookie(szName);
document. cookie = szName + "=" + szValue +
"; expires=" + dtExpires. toGMTString();
}
В последней строке этой функции указано такое значение параметра expires, при котором Cookie будет немедленно удален браузером.
Ограничения на использование Cookie. На использование Cookie накладываются определенные ограничения:
· всего можно создать не более 300 Cookie;
· необходимо, чтобы размер каждого Cookie не превышал 4 кб;
· для каждого домена м. б. создано не более 20 Cookie.
Если указанные ограничения будут нарушены, браузер может удалить самые старые Cookie или обрезать значения параметров Cookie.
|
Из за большого объема этот материал размещен на нескольких страницах:
1 2 3 4 5 6 |


