Полезное:
Как сделать разговор полезным и приятным
Как сделать объемную звезду своими руками
Как сделать то, что делать не хочется?
Как сделать погремушку
Как сделать так чтобы женщины сами знакомились с вами
Как сделать идею коммерческой
Как сделать хорошую растяжку ног?
Как сделать наш разум здоровым?
Как сделать, чтобы люди обманывали меньше
Вопрос 4. Как сделать так, чтобы вас уважали и ценили?
Как сделать лучше себе и другим людям
Как сделать свидание интересным?
Категории:
АрхитектураАстрономияБиологияГеографияГеологияИнформатикаИскусствоИсторияКулинарияКультураМаркетингМатематикаМедицинаМенеджментОхрана трудаПравоПроизводствоПсихологияРелигияСоциологияСпортТехникаФизикаФилософияХимияЭкологияЭкономикаЭлектроника
Метод submit() формы
Вызов метода submit () формы не равносилен нажатию кнопки отправки. При вызове этого метода будет выполнено только третье из вышеперечисленных трех действий - отправка данных на сервер. То, что он не должен порождать вызов обработчика onClick кнопки отправки, вполне понятно - ведь мы пытаемся отправить данные в обход кнопки отправки (которой, кстати, может и не быть вовсе). Но и обработчик события onSubmit у формы тоже не вызывается - это является для многих неожиданным. Не будем судить, насколько это логично (и почему это поведение отличается от поведения метода reset (), см. ниже), а просто проиллюстрируем этот эффект, введя в предыдущий пример ссылку, вызывающую метод submit ():
<FORM NAME=f ACTION="receive.htm" onSubmit="return confirm('Вы хотите отправить данные?')"><INPUT onClick="alert('Вызван обработчик onClick у кнопки отправки')" TYPE=submit VALUE="Кнопка отправки" NAME=s></FORM> <A HREF="javascript: document.f.submit();void(0);" >Вызвать метод <B>submit()</B> формы</A>5.8. Метод submit() не вызывает обработчика onSubmit
Тем самым данные могут уйти на сервер без предварительной проверки JavaScript-скриптом. Каким же образом заставить браузер вызвать обработчик onSubmit? Для этого существует возможность обратиться к этому обработчику напрямую: document.f.onsubmit(). Остается предусмотреть, что после этого метод submit () должен вызываться не всегда, а только если onSubmit либо не возвратил никакого значения, либо возвратил true, иными словами, если он не возвратил false. Окончательно мы получаем:
<FORM NAME=f ACTION="receive.htm" onSubmit="return confirm('Вы хотите отправить данные?')"><INPUT onClick="alert('Вызван обработчик onClick у кнопки отправки')" TYPE=submit VALUE="Кнопка отправки" NAME=s></FORM> <A HREF="javascript: if(document.f.onsubmit()!= false) document.f.submit(); void(0);" >Вызвать <B>submit()</B> с преварительной проверкой onSubmit</A>5.9. Принудительный вызов onSubmit перед submit()
Есть еще один способ инициировать отправку данных формы в обход кнопки отправки (которой, кстати, у формы может и не быть). Если фокус находится на любом текстовом поле <INPUT TYPE=text> формы и пользователь нажмет клавишу Enter, то (в большинстве браузеров) произойдет вызов обработчика события onSubmit формы и отправка данных на сервер.
Введите текст и нажмите Enter:<BR><FORM ACTION="receive.htm" onSubmit="return confirm('Вы хотите отправить данные?')"><INPUT TYPE=text VALUE="Текст вводить здесь:" SIZE=50></FORM>5.10. Отправка данных формы нажатием клавиши Enter
Этот способ работает логичнее, чем метод submit (), т.к. отправляемые на сервер данные не избегают предварительной проверки обработчиком onSubmit.
Кнопка reset
Кнопка сброса (reset) позволяет вернуть все поля формы в первоначальное состояние, которое они имели при загрузке страницы. Нажатие кнопки сброса приводит к следующей последовательности действий браузера:
1. вызов обработчика события onClick у данной кнопки;
2. вызов обработчика события onReset у формы;
3. восстановление значений по умолчанию во всех полях формы.
Вызов метода click () у кнопки сброса равносилен нажатию этой кнопки, т.е. приводит к тем же трем действиям:
<FORM NAME=f onReset="return confirm('Вы хотите очистить форму?')"><INPUT TYPE=text VALUE="Измените этот текст"><INPUT TYPE=reset VALUE="Кнопка сброса" NAME=s onClick="alert('Вызван обработчик onClick у кнопки сброса')"></FORM><A HREF="javascript: document.f.s.click();void(0);" >Вызвать метод <B>click()</B> кнопки сброса</A>5.11. Вызов метода click() у кнопки сброса
Есть способы сбросить форму в исходное состояние в обход кнопки сброса (которой, кстати, у формы может и не быть). Во-первых, это вызов метода reset () у формы. Во-вторых, если фокус находится на любом поле или кнопке формы, то можно нажать клавишу Esc. Пример:
Измените текст, а затем нажмите Esc (либо ссылку).<BR><FORM NAME=f onReset="return confirm('Вы хотите очистить форму?')"><INPUT TYPE=text VALUE="Измените этот текст"></FORM><A HREF="javascript: document.f.reset();void(0);" >Вызвать метод <B>reset()</B> формы</A>5.12. Сброс формы нажатием клавиши Esc
Как можно видеть, оба способа не просто сбрасывают форму, но и вызывают обработчик события onReset формы. Таким образом, метод reset () ведет себя более логично и предсказуемо, нежели submit ().
Графическая кнопка
Графическая кнопка - это разновидность кнопки отправки. Ее отличие в том, что вместо кнопки с надписью пользователь увидит картинку, по которой можно кликнуть:
<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() у графической кнопки
Поскольку графические кнопки используются довольно редко, на этом мы остановимся в их обсуждении.
Date: 2016-05-24; view: 393; Нарушение авторских прав; Помощь в написании работы --> СЮДА... |