Оглавление | Назад | Вперёд | Индекс

Button

Кнопка, размещённая на форме HTML.

Создание

HTML-тэг INPUT с "button" в качестве значения атрибута TYPE. Для данной формы машина выполнения JavaScript создаёт соответствующие объекты Button и помещает их в массив elements соответствующего объекта Form. Вы получаете доступ к объекту Button по индексу в данном массиве. Можно индексировать массив по числами или использовать значение атрибута NAME.

Обработчики событий

• onBlur
• onClick
• onFocus
• onMouseDown
• onMouseUp

Описание

Объект Button на форме выглядит так:

Объект Button это элемент формы и обязан быть определён внутри тэга FORM (теперь вроде уже нет - прим перев.).

Объект Button это специальная кнопка, которую можно использовать для выполнения определённой Вами акции. Кнопка выполняет скрипт, специфицированный её обработчиком onClick.

Свойства. Резюме.

form

name

type

value

Методы. Резюме.

blur

click

focus

handleEvent

Кроме того, этот объект наследует методы watch и unwatch из Object.

Примеры

В следующем примере создаётся кнопка с названием calcButton. Текст "Calculate" выводится на поверхности кнопки. При щелчке по кнопке вызывается функция calcFunction.

<INPUT TYPE="button" VALUE="Calculate" NAME="calcButton"

   onClick="calcFunction(this.form)">

См. также

blur

Убирает фокус с кнопки.

Синтаксис

blur()

Параметры

Отсутствуют.

Примеры

В этом примере фокус убирается с кнопки userButton:

userButton.blur()

Здесь предполагается, что кнопка определена так:

<INPUT TYPE="button" NAME="userButton">

См. также

click

Симулирует щелчок мыши по кнопке, но не запускает обработчик onClick.

Синтаксис

click()

Параметры

Отсутствуют.

Безопасность

Отправка формы по URL mailto: или news: требует привилегии UniversalSendMail. О безопасности см. Клиентский JavaScript. Руководство.

focus

Передаёт фокус кнопке.

Синтаксис

focus()

Параметры

Отсутствуют.

См. также

form

Ссылка на объект, специфицирующая форму, которая содержит кнопку.

Описание

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

Примеры

Пример 1.

В следующем примере форма myForm содержит объект Text и кнопку. Когда пользователь щёлкает по кнопке, в значение объекта Text устанавливается имя формы. Обработчик onClick кнопки использует this.form для обращения к родительской форме myForm.

<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">
</FORM>

Пример 2.

Здесь показана форма с несколькими элементами. Когда пользователь щёлкает 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="button" VALUE="Show Form Elements"

   onClick="showElements(this.form)">
</FORM>

Диалог alert выведет следующий текст:

JavaScript Alert:
Form Elements of form myForm:
text1
button1
button2

Пример 3.

В этом примере используется ссылка на объект вместо ключевого слова this для обращения к форме. Код возвращает ссылку на myForm, которая является формой, содержащей кнопку myButton.

document.myForm.myButton.form

См. также

handleEvent

Вызывает обработчик для специфицированного события.

Синтаксис

handleEvent(event)

Параметры

event

Описание

Об обработке событий см. Клиентский JavaScript. Руководство.

name

Строка, специфицирующая имя кнопки.

Безопасность

JavaScript 1.1. По умолчанию значение этого свойства разрушено. О разрушении данных см. книгу Клиентский JavaScript. Руководство.

Описание

Свойство name первоначально отражает значение атрибута NAME. Изменение свойства name переопределяет эту установку.

Не путайте свойство name с текстом, отображаемым на поверхности кнопки. Свойство value специфицирует лэйбл кнопки. Свойство name не выводится на экран; оно используется для программного обращения к объекту.

Если несколько объектов формы имеют одно значение атрибута NAME, автоматически создаётся массив с данным именем. Каждый элемент этого массива представляет отдельный Form -объект. Элементы индексируются в порядке их появления в коде, начиная с 0. Например, если два элемента Text и элемент Button в одной форме имеют атрибут 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>")
   }
}

В следующем примере первый оператор создаёт окно netscapeWin. Второй оператор выводит значение "netscapeHomePage" в диалоговом окне Alert, поскольку "netscapeHomePage" является значением аргумента windowName окна netscapeWin.

netscapeWin=window.open("http://home.netscape.com","netscapeHomePage")

alert(netscapeWin.name)

См. также

type

Для всех объектов Button значением свойства type будет "button". Это свойство специфицирует тип элемента формы.

Примеры

В следующем примере записывается значение свойства type каждого элемента формы.

for (var i = 0; i < document.form1.elements.length; i++) {

   document.writeln("<BR>type is " + document.form1.elements[i].type)
}

value

Строка - значение атрибута VALUE кнопки.

Безопасность

JavaScript 1.1. По умолчанию значение этого свойства разрушено. О разрушении данных см. книгу Клиентский JavaScript. Руководство.

Описание

Эта строка отображается на поверхности кнопки.

Значение свойства value является read-only в ОС Macintosh и UNIX. В Windows Вы можете изменять это свойство.

Если атрибут VALUE не специфицирован в HTML, свойство value является пустой строкой.

Не путайте свойство 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()
}

Будут выведены следующие значения:

Query Submit
Reset
Help

В предыдущем примере предполагается, что кнопки были определены так:

<INPUT TYPE="submit" NAME="submitButton">
<INPUT TYPE="reset" NAME="resetButton">
<INPUT TYPE="button" NAME="helpButton" VALUE="Help">

См. также

Оглавление | Назад | Вперёд | Индекс

Дата последнего обновления: 28 мая 1999 года.
Copyright (c) 1999 Netscape Communications Corporation