Стефан Кох - Введение в JavaScript для Мага
Здесь можно скачать бесплатно "Стефан Кох - Введение в JavaScript для Мага" в формате fb2, epub, txt, doc, pdf. Жанр: Программирование, год 1997. Так же Вы можете читать книгу онлайн без регистрации и SMS на сайте LibFox.Ru (ЛибФокс) или прочесть описание и ознакомиться с отзывами.
Название:
Введение в JavaScript для Мага
Автор:
Издательство:
неизвестно
Жанр:
Год:
1997
ISBN:
нет данных
Скачать:
Скачивание начинается... Если скачивание не началось автоматически, пожалуйста нажмите на эту ссылку.
Вы автор?
Жалоба
Жалоба
Все книги на сайте размещаются его пользователями. Приносим свои глубочайшие извинения, если Ваша книга была опубликована без Вашего на то согласия.
Напишите нам, и мы в срочном порядке примем меры.
Напишите нам, и мы в срочном порядке примем меры.
Как получить книгу?
Оплатили, но не знаете что делать дальше? Инструкция.
Описание книги "Введение в JavaScript для Мага"
Описание и краткое содержание "Введение в JavaScript для Мага" читать бесплатно онлайн.
pageX — Горизонтальное положение курсора (в пикселах) относительно окна браузера.
pageY — Вертикальное положение курсора (в пикселах) относительно окна браузера.
screenX — Горизонтальное положение курсора (в пикселах) относительно экрана.
screenY — Вертикальное положение курсора (в пикселах) относительно экрана.
target — Строка, представляющая объект, которому исходно было послано событие.
type — Строка, указывающая тип события.
which — ASCII-значение нажатой клавиши или номер клавиши мыши.
x — Синоним layerX
y — Синоним layerY
Перехват события
Одна из важных особенностей языка — перехват события. Если кто-то, к примеру, щелкает на кнопке, то вызывается программа обработки события onClick, соответствующая этой кнопке. С помощью обработки событий Вы можете добиться того, чтобы объект, соответсвующий вашему окну, документу или слою, перехватывал и обрабатывал событие еще до того, как для этой цели объектом указанной кнопки будет вызван обработчик событий. Точно так же объект вашего окна, документа или слоя может обрабатывать сигнал о событии еще до того, как он достигает своего обычного адресата.
Чтобы увидеть, для чего это может пригодиться, давайте рассмотрим следующий пример:
<html>
<head>
<script language="JavaScript">window.captureEvents(Event.CLICK);
window.onclick= handle;
function handle(e) {
alert("Объект window перехватывает это событие!");
return true; // т. е. проследить ссылку
}
</script>
</head>
<body>
<a href="test.htm">"Кликните" по этой ссылке.</a>
</body>
</html>
Как видно, мы не указываем программы обработки событий в тэге <a>. Вместо этого мы пишем
window.captureEvents(Event.CLICK);
с тем, чтобы перехватить событие Click объектом window. Обычно объект window не работает с событием Click. Однако, перехватив, мы затем его переадресуем в объект window.
Заметим, что в Event.CLICK фрагмент CLICK должен писаться заглавными буквами. Если же Вы хотите перехватывать несколько событий, то Вам следует отделить их друг от друга символами |. Например:
window.captureEvents(Event.CLICK | Event.MOVE);
Помимо этого в функции handle(), назначенной нами на роль обработчика событий, мы пользуемся инструкцией return true;. В действительности это означает, что браузер должен обработать и саму ссылку, после того, как завершится выполнение функции handle(). Если же Вы напишете вместо этого return false;, то на этом все и закончится.
Если теперь в тэге <a> Вы зададите программу обработки события onClick, то поймете, что данная программа при возникновении данного события вызвана уже не будет. И это не удивительно, поскольку объект window перехватывает сигнал о событии еще до того, как он достигает объекта link. Если же Вы определите функцию handle() как
function handle(e) {
alert("Объект window перехватывает это событие!");
window.routeEvent(e);
return true;
}
то компьютер будет проверять, определены ли другие программы обработки событий для данного объекта. Переменная e — это наш объект Event, передаваемый функции обработки событий в виде аргумента.
Кроме того, Вы можете непосредственно послать сигнал о событии какому-либо объекту. Для этого Вы можете воспользоваться методом handleEvent(). Это выглядит следующим образом:
<html>
<script language="JavaScript">
window.captureEvents(Event.CLICK);
window.onclick= handle;
function handle(e) {
document.links[1].handleEvent(e);
}
</script>
<a href="test.htm">"Кликните" по этой ссылке</a><br>
<a href="test.htm"
onClick="alert('Обработчик событий для второй ссылки!);">Вторая ссылка</a>
</html>
Все сигналы о событиях Click, посылаются на обработку по второй ссылке — даже если Вы вовсе и не щелкнули ни по одной из ссылок!
Следующий скрипт демонстрирует, как Ваш скрипт может реагировать на сигналы о нажатии клавиш. Нажмите на какую-либо клавишу и посмотрите, как работает этот скрипт.
<html>
<script language="JavaScript">
window.captureEvents(Event.KEYPRESS);
window.onkeypress= pressed;
function pressed(e) {
alert("Key pressed! ASCII-value: " + e.which);
}
</script>
</html>
Часть 12: Drag & Drop
Что такое drag & drop?
С помощью новой модели событий в языке JavaScript, 1.2 и механизма слоев мы можем реализовать на нашей web-странице схему drag & drop ("перетащил и оставил"). Для этого Вам понадобится по крайней мере Netscape Navigator 4.0, поскольку мы будем пользоваться особенностями языка JavaScript 1.2.
Что такое drag & drop? Например, некоторые операционные системы (такие как Win95/NT или MacOS) позволяют Вам стирать файлы, просто перетаскивая их в мусорную карзину. Иными словами, Вы щелкаете клавишей мыши над изображением файла, перетаскиваете его (то есть держите клавишу нажатой и просто двигаете мышь) — drag — в мусорную карзину, а затем отпускаете — drop — его там.
Механизм drag & drop, который мы хотим здесь реализовать, ограничивается web-страницей. Поэтому Вы не можете использовать представленный здесь код, чтобы переносить объекты с HTML-страницы на жесткий диск вашего компьютера или другие подобные действия. (Начиная с версии 4.0 браузера Netscape Navigator ваш скрипт может реагировать на событие с названием DragDrop, событие, когда кто-либо перетаскивает файл на окно вашего браузера. Но это не совсем то, о чем мы здесь хотим поговорить)
Посмотрите пример, который мы будем рассматривать в этой главе. После того, как откроется страница, Вы можете, нажав клавишу мыши, перетаскивать различные объекты:
Также можно рассмотреть пример, предоставленный компанией Netscape. Найти его Вы сможете по адресу: http://home.netscape.com/comprod/products/communicator/user_agent_vacation.html
Язык JavaScript не поддерживает напрямую механизм drag & drop. Это значит, что у нас нет возможности назначить объекту image свойство dragable (перемещаемый) или что-либо в этом роде. Поэтому мы должны сами писать необходимый для этого код. Впрочем, Вы увидите, что это не так сложно.
Итак, то же нам нужно? Нам нужны две вещи. Во-вервых, мы должны регистрировать определенные события, связанные с работой мышью, то есть нужно понять, каким образом, мы сможем узнать, какой объект необходимо переместить и на какую позицию? Затем нам нужно подумать, каким именно образом мы сможем показывать перемещение объектов по экрану. Конечно же, мы будем пользоваться такой новой возможностью языка, как слои, при создании объектов и перемещении их по экрану. Каждый объект представлен собственным слоем.
События при работе с мышью в JavaScript 1.2
Какие события, происходящие при работе с мышью, нам следует использовать? У нас нет такого события, как MouseDrag, однако того же самого мы можем достичь, отслеживая события MouseDown, MouseMove и MouseUp. В версии 1.2 языка JavaScript используется новая модель событий. И без нее мы не смогли бы решить нашу задачу. Я уже говорил об этой новой модели на предыдущем уроке. Однако давайте взглянем на некоторые важные ее части еще раз.
Пользователь нажал клавишу мыши в каком-либо месте на окне браузера. Наш скрипт должен зафиксировать это событие и вычислить, с каким объектом (то есть слоем) это было связано. Нам необходимо знать координаты точки, где произошло это событие. В JavaScript 1.2 реализован новый объект Event, который сохраняет координаты этой точки (а также еще и другую информацию о событии).
Другой важной момент заключается в перехвате событий. Если пользователь, например, щелкает по клавише мыши, то сигнал о соответствующем событии посылается непосредственно объекту button. Однако в нашем примере необходимо, чтобы событие обрабатывалось объектом window (окно). Поэтому мы позволяем объекту окна перехватывать сигнал о событии, связанном с мышью, т. е. чтобы именно объект window фиксировал это событие и имел возможность на него реагировать. Это демонстрируется в следующем примере (на примере события Click). Вы можете щелкнуть в любом месте окна браузера. При этом возникнет окно сообщения, где будут показаны координаты точки, где это событие имело место.
Код этого примера:
<html>
<script language="JavaScript">
<!-
window.captureEvents(Event.CLICK);
window.onclick= displayCoords;
function displayCoords(e) {
alert("x: " + e.pageX + " y: " + e.pageY);
}
// — >
</script>
"Кликните" клавишей мыши где-нибудь в этом окне.
</html>
Сперва мы сообщаем, что объект window перехватывает сигнал о событии Click. Для этого мы пользуемся методом captureEvent(). Строка
window.onclick= displayCoords;
говорит о том, что должно происходить, когда случается событие Click. Конкретнее, здесь сообщается, что в качестве реакции на событие Click браузер должен вызвать процедуру displayCoords() (Заметим, что Вам при этом не следует ставить скобки после слова displayCoords). В свою очередь, displayCoords() — это функция, которая определяется следующим образом:
На Facebook
В Твиттере
В Instagram
В Одноклассниках
Мы Вконтакте
Подписывайтесь на наши страницы в социальных сетях.
Будьте в курсе последних книжных новинок, комментируйте, обсуждайте. Мы ждём Вас!
Подписывайтесь на наши страницы в социальных сетях.
Будьте в курсе последних книжных новинок, комментируйте, обсуждайте. Мы ждём Вас!
Похожие книги на "Введение в JavaScript для Мага"
Книги похожие на "Введение в JavaScript для Мага" читать онлайн или скачать бесплатно полные версии.
Понравилась книга? Оставьте Ваш комментарий, поделитесь впечатлениями или расскажите друзьям
Уважаемый посетитель, Вы зашли на сайт как незарегистрированный пользователь.
Мы рекомендуем Вам зарегистрироваться либо войти на сайт под своим именем.
Мы рекомендуем Вам зарегистрироваться либо войти на сайт под своим именем.
Отзывы о "Стефан Кох - Введение в JavaScript для Мага"
Отзывы читателей о книге "Введение в JavaScript для Мага", комментарии и мнения людей о произведении.