javascript参考 表单元素的属性和方法 一
Button
HTML 表单上的一个按钮。
创建源
TYPE 属性为“button”的 HTML INPUT 标签可创建此种对象。对于一个给定的表单,JavaScript 运行时刻引擎将为每个按钮创建一个独立的 Button 对象,然后将它们放在对应的 Form 对象的 elements 数组中。通过对该数组的索引,你可访问一个 Button 对象。具体方法是使用编号或者在已知 NAME 属性的情况下使用之。
一个 Button 对象就是一个表单元素,必须在 FORM 标签中定义。
Button 对象是一种自定义的按钮,你可以用来执行任何你定义的操作。该按钮将执行其 onClick 事件控制句柄中的脚本。
属性
form
对包含该按钮的窗体的引用。
属性源 Button
只读
描述
每个表单元素都有一个 form 属性用于指向元素的父表单。该属性在事件控制句柄中特别有用,你可能想要由其获得当前表单中其它元素。每个表单元素都有一个 form 属性用于指向元素的父表单。该属性在事件控制句柄中特别有用,你可能想要由其获得当前表单中其它元素。
示例
示例 1. 在下面的例子中,窗体 myForm 包含了一个 Text 对象和一个按钮。当用户单击按钮的时候,窗体的名字就将赋给 Text 对象。按钮的 onClick 事件控制句柄使用 this.form 来引用父窗体 myForm。
<FORM NAME="myForm">
窗体名称:
<INPUT TYPE="text" NAME="text1" VALUE="asp学习网位于www.aspxuexi.com">
<P>
<INPUT NAME="button1" TYPE="button" VALUE="显示窗体名称"
onClick="this.form.text1.value=this.form.name">
</FORM>
示例 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="asp学习网位于www.aspxuexi.com">
<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
描述
name 属性实际上对应于 NAME 属性。更改 name 属性将覆盖此规定。
不要混淆 name 属性和在按钮上显示的文本。value 属性对应于按钮上显示的文本。name 属性不会显示在屏幕上;它是用来在编程上引用对象的。
如果同一表单中有多个 NAME 属性相同的对象,将会自动创建一个该名称的数组。该数组中的每一个元素描述一个单独的对象。元素按照源文件的顺序从 0 开始依次索引。例如,如果相同窗体中有 NAME 属性同为“myField”的两个 Text 元素和一个 Button 元素,将会自动创建元素为 myField[0]、myField[1] 和 myField[2] 的数组。你需要在代码中注意到这种情况,并且自行识别 myField 到底是对单个元素还是元素的数组的引用。
示例
在下面的例子中,valueGetter 函数将使用循环来遍历 valueTest 窗体中的元素数组。msgWindow 窗口将显示该窗体中所有元素的名称:
==========www.aspxuexi.com=====================
newWindow=window.open("http://www.aspxuexi.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”,因为“netscapeHomePage”是 netscapeWin 的 windowName 参数的值。
netscapeWin=window.open("http://www.aspxuexi.com","netscapeHomePage")
alert(netscapeWin.name)
type
对于所有的 Button 对象,type 属性的值都是“button”。该属性指定了表单元素的类型。
属性源 Button
只读
示例
下面的例子将把表单中的每个元素的 type 属性写到文档中。
for (var i = 0; i < document.form1.elements.length; i++) {
document.writeln("<BR>type is " + document.form1.elements[i].type)
}
value
对应于按钮的 VALUE 属性的字符串。
属性源 Button
只读 Mac and UNIX
描述
该字符串显示于按钮的表面上。
在 Macintosh 和 UNIX 系统中概属性是只读的。在 Windows 上,你可以更改此属性。
如果在 HTML 中没有指定 VALUE 属性,value 属性将为空字符串。
不要混淆 value 属性和 name 属性。name 属性不会显示在屏幕上;它是用来在编程上引用对象的。
示例
下面的函数将获取每组按钮的 value 属性,并将其显示在 msgWindow 窗口中:
==================================asp学习网================
function valueGetter() {
var msgWindow=window.open("")
msgWindow.document.write("submitButton.value 为 " +
document.valueTest.submitButton.value + "<BR>")
msgWindow.document.write("resetButton.value 为 " +
document.valueTest.resetButton.value + "<BR>")
msgWindow.document.write("helpButton.value 为 " +
document.valueTest.helpButton.value + "<BR>")
msgWindow.document.close()
}
==================================asp学习网================
该例子将显示下列值:
Query Submit
Reset
帮助
上面的例子假定按钮定义如下:
<INPUT TYPE="submit" NAME="submitButton">
<INPUT TYPE="reset" NAME="resetButton">
<INPUT TYPE="button" NAME="helpButton" VALUE="帮助">
方法
blur
从按钮中移除焦点。
方法源 Button
语法
blur()
参数
无
示例
下面的例子将把焦点从元素 userButton 中移除:
userButton.blur()
这个例子假定按钮定义如下:
<INPUT TYPE="button" NAME="userButton">
click
模拟鼠标单击按钮,但是并不触发按钮的 onClick 事件控制句柄。
方法源 Button
语法
click()
参数
无。
focus
将焦点移至该按钮处。
方法源 Button
语法
focus()
参数
无。
参看
Button.blur
handleEvent
调用指定事件的控制句柄。
方法源 Button
语法
handleEvent(event)
参数
event 你想要调用的对象的某一事件控制句柄的名称。
from:asp学习网/title:javascript参考 表单元素的属性和方法 一/ time:2007-3-30 19:47:27
本文主题表单