中国网站美工网!网页设计者的天堂!
本站特色:HTML网页模版下载    
  您的位置:

首页 >> 设计学院 >> web语言开发 >> HTML/CSS >> 正文

相关信息

用JavaScript实现更复杂的交互
JavaScript窗口及输入输出
JavaScript对象系统的使用
在JavaScript中创建新对象
基于对象的JavaScript语言
JavaScript程序构成
JavaScript基本数据结构
JavaScript教程语言概况
Struts (User Guide 中文节译) 
Java基础知识——Java入门与加深

用JavaScript脚本实现Web页面信息交互

用JavaScript脚本实现Web页面信息交互


来源: 网络 | 时间: 2007-3-21 12:15:17 | 人气:

 

用JavaScript脚本实现Web页面信息交互

  要实现动态交互,必须掌握有关窗体对象(Form)和框架对象(Frames)更为复杂的知识。

一、窗体基础知识
  窗体对象可以使设计人员能用窗体中不同的元素与客户机用户相交互,而用不着在之前首先进行数据输入,就可以实现动态改变Web文档的行为。

1、什么是窗体对象
窗体(Form):它构成了Web页面的基本元素。通常一个Web页面有一个窗体或几个窗体,使用Forms[]数组来实现不同窗体的访问。
<form Name=Form1>
<INPUT type=text...>
<Input type=text...>
<Inpup byne=text...>
</form>
<form Name=Form2>
<INPUT type=text...>
<Input type=text...>
</form>

  在Forms[0]中共有三个基本元素,而Forms[1]中只有两个元素。
  窗体对象最主要的功能就是能够直接访问HTML文档中的窗体,它封装了相关的HTML代码:

<Form
Name ="表的名称"
Target ="指定信息的提交窗口"
action ="接收窗体程序对应的URL"
Method =信息数据传送方式(get/post)
enctype ="窗体编码方式"
[onsubmit ="JavaScript代码"]>
</Form>
 

2、窗体对象的方法
  窗体对象的方法只有一个--submit()方法,该方法主要功用就是实现窗体信息的提交。如提交Mytest窗体,则使用下列格式:
document.mytest.submit()
 
3、窗体对象的属性
  窗体对象中的属性主要包括以下:elements name action target encoding method.
  除Elements外,其它几个均反映了窗体中标识中相应属性的状态,这通常是单个窗体标识;而elements常常是多个窗体元素值的数组,例:
elements[0].Mytable.elements[1]
 
4、访问窗体对象
在JavaScript中访问窗体对象可由两种方法实现:
(1)通过访问窗体
  在窗体对象的属性中首先必须指定其窗体名,而后就可以通过下列标识访问窗体如:document.Mytable()。
(2)通过数组来访问窗体
  除了使用窗体名来访问窗体外,还可以使用窗体对象数组来访问窗体对象。但需要注意一点,因窗体对象是由浏览器环境的提供的,而浏览器环境所提供的数组下标是由0到n。所以可通过下列格式实现窗体对象的访问:
document.forms[0]
document.forms[1]
document.forms[2]...
 
5、引用窗体的先决条件
  在JavaScript中要对窗体引用的条件是:必须先在页面中用标识创建窗体,并将定义窗体部分放在引用之前。
 
二、窗体中的基本元素
窗体中的基本元素由按钮、单选按钮、复选按钮、提交按钮、重置按钮、文本框等组成。
在JavaScript中要访问这些基本元素,必须通过对应特定的窗体元素的数组下标或窗体元素名来实现。每一个元素主要是通过该元素的属性或方法来引用。其引用的基本格式见下:
formName.elements[].methadName (窗体名.元素名或数组.方法)
formName.elemaent[].propertyName(窗体名.元素名或数组.属性)
 
下面分别介绍:
 
1、Text单行单列输入元素
 功能:对Text标识中的元素实施有效的控制。
 基本属性:
Name:设定提交信息时的信息名称。对应于HTML文档中的Name。
Value:用以设定出现在窗口中对应HTML文档中Value的信息。
defaultvalue:包括Text元素的默认值
 基本方法:
blur():将当前焦点移到后台。
select():加亮文字。
 主要事件:
onFocus:当Text获得焦点时,产生该事件。
OnBlur:从元素失去焦点时,产生该事件。
Onselect:当文字被加亮显示后,产生该文件。
onchange:当Text元素值改变时,产生该文件。
例:...
<Form name="test">
<input type="text" name="test" value="this is a javascript" >
</form>
...
<script language ="Javascirpt">
document.mytest.value="that is a Javascript";
document.mytest.select();
document.mytest.blur();
</script>
 

2、textarea多行多列输入元素
 功能:实施对Textarea中的元素进行控制。
 基本属性

本新闻共3页,当前在第1页  1  2  3  

 
  上一篇:JavaScript窗口及输入输出  下一篇:用JavaScript实现更复杂的交互
Copyright © 2005 - 2006 WEB600.Net,All Rights Reserved
业务联系 QQ 站长:106324307 美工:270348300 程序:63888546
E-mail: 3235183@163.com MSN: fuqiyangru@hotmail.com
中国网站美工网--网页设计者的天堂! 陕ICP备06005517号
本站资源来自互联网 如果侵犯您的权利 请通知我们 我们会尽快删除