Button

JavaScript

previous page next page

JavaScript手册

Button

HTML 表单上的一个按钮。

客户端对象
实现版本	Navigator 2.0 Navigator 3.0: 添加了 type 属性; 添加了 onBlur 和 onFocus 事件句柄；添加了 blur 和 focus 方法。 Navigator 4.0: 添加了 handleEvent 方法。

创建源

TYPE 属性为“button”的 HTML elements 数组中。通过对该数组的索引，你可访问一个 Button 对象。具体方法是使用编号或者在已知 NAME 属性的情况下使用之。

事件句柄

onBlur

onClick

onFocus

onMouseDown

onMouseUp

描述

表单上的 Button 对象看起来与下图类似：

一个 Button 对象就是一个表单元素，必须在 FORM 标签中定义。

Button 对象是一种自定义的按钮，你可以用来执行任何你定义的操作。该按钮将执行其 onClick 事件控制句柄中的脚本。

属性概览

form	指定了包含该 Button 对象的表单。
name	对应于 NAME 属性。
type	对应于 TYPE 属性。
value	对应于 VALUE 属性。

方法概览

blur	从按钮上移除焦点。
click	模拟对按钮的单击。
focus	将焦点移至按钮。
handleEvent	调用指定事件的控制句柄。

示例

下面的例子创建了一个叫做“calcButton”的按钮，其上显示了文本“计算”。当单击该按钮时，将调用 calcFunction 函数。

form

对包含该按钮的窗体的引用。

属性源	Button
只读
实现版本	Navigator 2.0

描述

每个表单元素都有一个 form 属性用于指向元素的父表单。该属性在事件控制句柄中特别有用，你可能想要由其获得当前表单中其它元素。每个表单元素都有一个 form 属性用于指向元素的父表单。该属性在事件控制句柄中特别有用，你可能想要由其获得当前表单中其它元素。

示例

示例 1. 在下面的例子中，窗体 myForm 包含了一个 Text 对象和一个按钮。当用户单击按钮的时候，窗体的名字就将赋给 Text 对象。按钮的 onClick 事件控制句柄使用 this.form 来引用父窗体 myForm。

示例 2. 下面的例子显示了带有几个元素的窗体。当用户单击 button2 时，函数 showElements 将显示一个警告对话框，里面包含了窗体 myForm 上的每个元素的名称。

function showElements(theForm) {
   str = "窗体 " + theForm.name + " 的元素包括：\n "
   for (i = 0; i < theForm.length; i++)
      str += theForm.elements[i].name + "\n"
   alert(str)
}
</script>
<FORM NAME="myForm">
窗体名称：<INPUT TYPE="text" NAME="text1" VALUE="爱啥是啥">
<P>
<INPUT NAME="button1" TYPE="button" VALUE="显示窗体名称"
   onClick="this.form.text1.value=this.form.name">
<INPUT NAME="button2" TYPE="button" VALUE="显示窗体元素"
   onClick="showElements(this.form)">
</FORM>

警告对话框将显示下列文本：

JavaScript 警告：
窗体 myForm 的元素包括：
text1
button1
button2

示例 3. 下面的例子使用对象引用，而不是关键字来参考窗体。下面的代码将返回对 myForm 的引用，其中包含了 myButton。

document.myForm.myButton.form

name

指定了按钮名称的字符串。

属性源	Button
实现版本	Navigator 2.0

安全性

Navigator 3.0：该属性默认是带有污点的。有关数据污点的更多信息，请看“JavaScript 的安全性”。

描述

name 属性实际上对应于 NAME 属性。更改 name 属性将覆盖此规定。

不要混淆 name 属性和在按钮上显示的文本。value 属性对应于按钮上显示的文本。name 属性不会显示在屏幕上；它是用来在编程上引用对象的。

如果同一表单中有多个 NAME 属性相同的对象，将会自动创建一个该名称的数组。该数组中的每一个元素描述一个单独的对象。元素按照源文件的顺序从 0 开始依次索引。例如，如果相同窗体中有 NAME 属性同为“myField”的两个 Button 元素，将会自动创建元素为 myField[0]、myField[1] 和 myField[2] 的数组。你需要在代码中注意到这种情况，并且自行识别 myField 到底是对单个元素还是元素的数组的引用。