В атрибуте кнопки можно задать обработчик события onClick, а в атрибуте формы - обработчики событий onSubmit и onReset. Кроме того, кнопкам и форме соответствуют объекты DOM. Объект, отвечающий кнопке, имеет методclick(). Объект, отвечающий форме, имеет методы submit() и reset(). С точки зрения программирования важен вопрос о взаимодействии этих методов друг с другом и с соответствующими обработчиками событий.
В каком случае при вызове метода (из любого места JavaScript-программы) будет автоматически вызван и соответствующий обработчик события, заданный пользователем в атрибуте кнопки или формы? Ответ здесь следующий:
при вызове метода click() кнопки вызывается и обработчик события onClick этой кнопки;
при вызове метода submit() формы не вызывается обработчик события onSubmitформы;
при вызове метода reset() формы вызывается и обработчик события onResetформы.
Ниже мы на примерах рассмотрим, что это означает на практике. Таким образом, при программном вызове метода submit() нужно позаботиться о дополнительном вызове обработчика события onSubmit, чтобы, например, данные не были отправлены на сервер без предварительной проверки. Как это сделать - мы расскажем ниже. Особое внимание мы уделим также возможности перехвата и генерирования события отправки данных на сервер.
Кнопка типа button вводится в форму главным образом для того, чтобы можно было выполнить какие-либо действия либо при ее нажатии пользователем, либо при вызове метода click().
<FORM NAME=f><INPUT TYPE=button NAME=b VALUE="Кнопка" onClick="alert('5+7='+(5+7))"></FORM><A HREF="javascript:document.f.b.click();void(0);">Вызвать метод click()</A>
Вызов метода click() у кнопки равносилен нажатию кнопки, что и демонстрирует приведенный пример. Как мы увидим ниже, это же справедливо для любых типов кнопок.
Кнопка отправки ( submit ) позволяет отправить данные, введенные в форму, на сервер. В простейшем случае - при отсутствии у контейнера <FORM> атрибутов ACTION(его значением по умолчанию является адрес текущей страницы), METHOD (его значением по умолчанию является GET ) и TARGET (его значением по умолчанию является _self ) - стандартным действием браузера при отправке данных на сервер является просто перезагрузка текущей страницы, что подтверждает следующий пример:
<FORM><INPUT TYPE=submit></FORM>
Для имитации ответа сервера заготовим следующий простой HTML-файл receive.htm:
<HTML><BODY>Данные приняты!</BODY></HTML>
Теперь усложним наш пример: добавим обработчики событий onClick (у кнопки отправки) и onSubmit (у формы), и посмотрим на поведение браузера при нажатии кнопки отправки:
Пример 5.6. Обработчики onClick у кнопки отправки и onSubmit у формы (html, txt)
Убедитесь, что нажатие кнопки отправки приводит к следующей последовательности действий браузера:
вызов обработчика события onClick у данной кнопки;
вызов обработчика события onSubmit у формы;
отправка данных формы на сервер.
Соответственно, для выполнения дополнительных действий перед отправкой данных можно поместить код в любой из указанных обработчиков; в частности, поместив в какой-либо из них оператор return false, мы сможем предотвратить отправку данных.
Вызов метода click() кнопки отправки равносилен нажатию этой кнопки - произойдут все три вышеперечисленных действия:
