Кнопка submit на HTML-форме. Кнопка submit отправляет форму на сервер.
Клиентский объект
Реализован в
JavaScript 1.0
JavaScript 1.1: добавлено свойство type; добавлены обработчики onBlur
и onFocus; добавлены методы blur и focus.
JavaScript 1.2: добавлен метод handleEvent.
Создание
HTML-тэгом INPUT с "submit" в качестве значения
атрибута TYPE. Для данной формы машина выполнения JavaScript
создаёт соответствующий объект Submit и помещает его в массив elements
соответствующего объекта Form. Вы
получаете доступ к к объекту Submit по индексу в этом массиве.
Можно индексировать массив цифрами или, если имеются, по значениям атрибута NAME.
Объект Submit является элементом формы и обязан быть определён в тэге FORM.
Щелчок по кнопке submit отправляет форму по URL, специфицированному в свойстве action
формы. Эта акция всегда загружает клиенту новую страницу; это может быть та же
страница, что и текущая, если action это специфицирует или если не специфицирует.
Обработчик onClick кнопки submit не может предотвратить отправку
формы; используйте вместо этого обработчика обработчик onSubmit или
метод submit вместо объекта Submit. См. примеры для объекта Form.
Каждый элемент формы имеет свойство form которое является ссылкой
на родительскую форму элемента. Это свойство используется в основном с
обработчиками событий, где может понадобиться обратиться к другому элементу текущей формы.
Пример
В этом примере показана форма с несколькими элементами. Если пользователь
щёлкает на кнопке button2, функция showElements
выводит alert-диалог с именами всех элементов формы myForm.
<SCRIPT> function showElements(theForm) { str = "Form Elements of form " + theForm.name + ": \n " for (i = 0; i < theForm.length; i++) str += theForm.elements[i].name + "\n" alert(str) } </SCRIPT> <FORM NAME="myForm"> Form name:<INPUT TYPE="text" NAME="text1" VALUE="Beluga"> <P> <INPUT NAME="button1" TYPE="button" VALUE="Show Form Name" onClick="this.form.text1.value=this.form.name"> <INPUT NAME="button2" TYPE="submit" VALUE="Show Form Elements" onClick="showElements(this.form)"> </FORM>
Диалог alert выведет следующий текст:
Form Elements of form myForm: text1 button1 button2
Свойство name первоначально отражает значение атрибута NAME.
Изменение свойства name переопределяет значение атрибута.
Не путайте свойство name с текстом, отображаемым на поверхности Submit-кнопки.
Свойство value специфицирует текст на кнопке. Свойство name
не выводится на экран; оно используется для программного обращения к кнопке.
Если несколько объектов на одной форме имеют одинаковые значения атрибута NAME,
автоматически создаётся массив с данным именем. Каждый элемент этого массива
представляет отдельный Form-объект. Элементы индексируются в
порядке расположения в исходном коде, начиная с 0. Например, если два элемента Text
и элемент Submit на одной форме имеют в своих атрибутах NAME
значение "myField", создаётся массив из элементов myField[0], myField[1]
и myField[2]. Вы должны знать о такой ситуации в Вашем коде и
знать, ссылается ли myField на единственный элемент или на массив элементов.
Пример
Здесь функция valueGetter использует цикл for для
итерации по массиву элементов формы valueTest. Окно msgWindow
отображает имена всех элементов формы:
newWindow=window.open("http://home.netscape.com")
function valueGetter() { var msgWindow=window.open("") for (var i = 0; i < newWindow.document.valueTest.elements.length; i++) { msgWindow.document.write(newWindow.document.valueTest.elements[i].name + "<BR>") } }
Если атрибут VALUE специфицируется в HTML, свойство value
будет содержать эту же строку, и она будет отображаться на поверхности кнопки.
Если атрибут VALUE не специфицируется в HTML, свойство value
кнопки будет иметь значение "Submit Query".
Не путайте свойство value со свойством name. Свойство name
не отображается на экране; оно используется для программного обращения к кнопке.
Пример
Следующая функция вычисляет свойство value группы кнопок и выводит его в окне msgWindow:
function valueGetter() { var msgWindow=window.open("") msgWindow.document.write("submitButton.value is " + document.valueTest.submitButton.value + "<BR>") msgWindow.document.write("resetButton.value is " + document.valueTest.resetButton.value + "<BR>") msgWindow.document.write("helpButton.value is " + document.valueTest.helpButton.value + "<BR>") msgWindow.document.close() }