русс | укр

Языки программирования

ПаскальСиАссемблерJavaMatlabPhpHtmlJavaScriptCSSC#DelphiТурбо Пролог

Компьютерные сетиСистемное программное обеспечениеИнформационные технологииПрограммирование

Все о программировании


Linux Unix Алгоритмические языки Аналоговые и гибридные вычислительные устройства Архитектура микроконтроллеров Введение в разработку распределенных информационных систем Введение в численные методы Дискретная математика Информационное обслуживание пользователей Информация и моделирование в управлении производством Компьютерная графика Математическое и компьютерное моделирование Моделирование Нейрокомпьютеры Проектирование программ диагностики компьютерных систем и сетей Проектирование системных программ Системы счисления Теория статистики Теория оптимизации Уроки AutoCAD 3D Уроки базы данных Access Уроки Orcad Цифровые автоматы Шпаргалки по компьютеру Шпаргалки по программированию Экспертные системы Элементы теории информации

Лекция: Программируем гипертекстовые переходы


Дата добавления: 2013-12-23; просмотров: 1628; Нарушение авторских прав


Графическая кнопка

Графическая кнопка - это разновидность кнопки отправки. Ее отличие в том, что вместо кнопки с надписью пользователь увидит картинку, по которой можно кликнуть:

<FORM ACTION="receive.htm"><INPUT TYPE=image SRC="pic.gif"></FORM>

Кроме того, когда пользователь кликает по графической кнопке, то на сервер отправятся не только данные, введенные в поля формы, но также и координаты указателя мыши относительно левого верхнего угла изображения. К сожалению, перехватить эти координаты в JavaScript-программе не удается. Если Вам необходимо работать с этими координатами, то вместо графической кнопки рекомендуется создать активную карту с помощью контейнера <MAP>.

Графические кнопки имеют ряд странностей. Например, являясь одновременно и кнопкой, и изображением, они почему-то отсутствуют как в коллекцииdocument.f.elements[], так и в коллекции document.images[] (IE 7, Mozilla Firefox). Как следствие, они не учитываются ни в общем количестве элементов формы ( document.f.length ), ни в общем количестве изображений документа (document.images.length ).

Как же обратиться к такой кнопке? Это можно сделать, например, задав атрибутID:

<INPUT TYPE=image SRC="pic.gif" ID="d1">

и затем в программе написав: var knopka = document.getElementById('d1'). После этого мы можем обращаться к свойствам этой кнопки, напримерknopka.src, а также к методу knopka.click(). Следующий пример показывает, что вызов метода click() графической кнопки "почти" равносилен нажатию этой кнопки, т.е. последовательно вызывает обработчики onClick кнопки, onSubmitформы и передает данные на сервер (но что при этом передается в качестве координат курсора мыши?):

<FORM ACTION="receive.htm" onSubmit="return confirm('Вы хотите отправить данные?')"><INPUT onClick="alert('Вызван обработчик onClick у графической кнопки')" TYPE="image" SRC="pic.gif" id="d1"></FORM> <A HREF="javascript: var knopka = document.getElementById('d1'); knopka.click(); void(0);" >Вызвать метод <B>click()</B> графической кнопки</A>

Пример 5.13. Вызов метода click() у графической кнопки (html, txt)



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

 

 

Для начала нам нужно разделить несколько понятий: применимость URL в атрибутах HTML-контейнеров; коллекция гипертекстовых ссылок; объекты классаURL.

Адреса URL могут использоваться в атрибутах многих HTML-контейнеров, например:

  • ссылки (URL в атрибуте HREF контейнера<A> );
  • активные области (URL в атрибуте HREFконтейнера <AREA> );
  • картинки (URL в атрибуте SRCконтейнера <IMG> );
  • формы (URL в атрибуте ACTION контейнера <FORM> );
  • внешние скрипты (URL в атрибуте SRC контейнера <SCRIPT> );
  • связанные документы (URL в атрибуте HREF контейнера <LINK> ).

Гипертекстовая ссылка в HTML-документе - это область HTML-страницы, по которой можно "кликнуть" (или выбрать ее иным способом), чтобы перейти к просмотру другого HTML-документа. Из всех перечисленных выше вариантов применения URL гипертекстовыми ссылками являются лишь первые два. В объектной модели документа (DOM) они собраны в единую коллекциюгипертекстовых ссылок document.links[]. Нумерация в ней начинается с нуля (как обычно), в порядке появления ссылок в документе.

Обратите внимание, что в принципе могут существовать ссылки, по которым невозможно "кликнуть", т.к. они занимают нулевую площадь web-страницы; например, контейнер <A> с пустым содержимым, т.е. <A HREF="http://ya.ru/"></A>, или контейнер <AREA>, ограничивающий фигуру нулевой площади. Тем не менее все они считаются гипертекстовыми ссылками и содержатся в коллекцииdocument.links[]. С другой стороны, в коллекцию document.links[] не попадаютякоря, то есть контейнеры <A>, не имеющие атрибута HREF (якоря нужны, чтобы задать место, на которое можно сослаться из другой гиперссылки). Все контейнеры <A> (как якоря, так и гиперссылки) собраны в коллекцииdocument.anchors[] ; в этой лекции, однако, она нас не будет интересовать.

В объектной модели документа DOM объекты класса URL имеют такие свойства, как href, protocol, hostname и т.д. (полный перечень см. ниже). В класс URLвходят объекты коллекции document.links[], а также объект window.location, рассматривавшийся в лекции 4. Конечно, помимо общих свойств, перечисленных ниже, эти объекты могут иметь свои специфичные только для них свойства, методы и события. Например, у объекта window.location есть метод reload(), тогда как у ссылок его нет, но у них есть обработчик события onClick. Мы начнем с рассмотрения объектов класса URL.



<== предыдущая лекция | следующая лекция ==>
Кнопка reset | Объекты URL


Карта сайта Карта сайта укр


Уроки php mysql Программирование

Онлайн система счисления Калькулятор онлайн обычный Инженерный калькулятор онлайн Замена русских букв на английские для вебмастеров Замена русских букв на английские

Аппаратное и программное обеспечение Графика и компьютерная сфера Интегрированная геоинформационная система Интернет Компьютер Комплектующие компьютера Лекции Методы и средства измерений неэлектрических величин Обслуживание компьютерных и периферийных устройств Операционные системы Параллельное программирование Проектирование электронных средств Периферийные устройства Полезные ресурсы для программистов Программы для программистов Статьи для программистов Cтруктура и организация данных


 


Не нашли то, что искали? Google вам в помощь!

 
 

© life-prog.ru При использовании материалов прямая ссылка на сайт обязательна.

Генерация страницы за: 0.005 сек.