Javascript 表单之间的数据传递代码


Posted in Javascript onDecember 04, 2008

一,最简单的就是同一个网页里的表单的数据传递。
举个实例,一个网页上有两个表单,每个表单里一个文本框,一个按钮。点按钮互相对操作对方的文本框的值。我们举的例子是把一个文本框付给另一个文本框。具体的HTML代码如下: 

<html> 
<head> 
<title>Untitled Document</title> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312"> 
</head> 
<body> 
<form name="form1" method="post" action=""> 
<input type="text" name="textfield"> 
<input type="button" name="Submit" value="1--------->2" onClick="ok()"> 
</form> 
<form name="form2" method="post" action=""> 
<input type="text" name="textfield2"> 
<input type="button" name="Submit" value="2----->1" onClick="ok1()"> 
</form> 
</body> 
</html>

以上为HTMl的代码,大家可能注意到了onclik的代码了,有两个函数,接下来就是JAVASCRIPT的代码了:
<script language="JavaScript"> 
function ok() 
{ 
document.form2.textfield2.value=document.form1.textfield.value; 
} 
function ok1() 
{ 
document.form1.textfield.value=document.form2.textfield2.value; 
} 
</script>

二,第二种是两个窗口之间的表单的文本框之间数据传递。其实这个可以在原来的基础上进行一些扩展就可以了。关于如何创建弹出窗口,窗体里的表单的代码, 在这里就不多说了,现在在这里说一下如何操作父窗口的表单里的文本框的数据。具体代码如下:
<script language="JavaScript"> 
function ok() 
{ 
opener.document.form2.textfield2.value=document.form1.textfield.value 
} 
</script>

三,第三种就是框架网页之间的表单的文本框之间数据传递.
注意的地方是框架的写法:
<frameset cols="505,505"> 
<frame src="test.htm" name="leftr" id="leftr">//定义框架的名称 
<frame src="test2.htm" id="right" name="right"> 
</frameset> 
<noframes><body> 
</body></noframes>

具体的实现代码如下:
<script language="JavaScript"> 
function ok() 
{ 
parent.leftr.document.form2.textfield2.value 
=document.form1.textfield.value 
} 
</script>

这三种窗口之间的文本框数值互相操作的简单方法就实现了,其它需要注意的就是他们之间的关系。
Javascript 相关文章推荐
javascript instanceof 与typeof使用说明
Jan 11 Javascript
JavaScript中实现sprintf、printf函数
Jan 27 Javascript
jQuery实现的淡入淡出二级菜单效果代码
Sep 15 Javascript
javascript实现二级级联菜单的简单制作
Nov 19 Javascript
EasyUI创建对话框的两种方式
Aug 23 Javascript
Node.js 数据加密传输浅析
Nov 16 Javascript
jQuery UI仿淘宝搜索下拉列表功能
Jan 10 Javascript
微信小程序 开发经验整理
Feb 15 Javascript
svg动画之动态描边效果
Feb 22 Javascript
ES6中class类用法实例浅析
Apr 06 Javascript
vue2.0+vuex+localStorage代办事项应用实现详解
May 31 Javascript
解决vue cli4升级sass-loader(v8)后报错问题
Jul 30 Javascript
Javascript !!的作用
Dec 04 #Javascript
js 深拷贝函数
Dec 04 #Javascript
JavaScript 基础问答三
Dec 03 #Javascript
asp 取文本框名称代码
Dec 02 #Javascript
JavaScript获得选中文本内容的方法
Dec 02 #Javascript
js调试工具 Javascript Debug Toolkit 2.0.0版本发布
Dec 02 #Javascript
在IE,Firefox,Safari,Chrome,Opera浏览器上调试javascript
Dec 02 #Javascript
You might like
php Smarty初体验二 获取配置信息
2011/08/08 PHP
什么情况下可以不写PHP的闭合标签“?&gt;”
2014/08/28 PHP
codeigniter显示所有脚本执行时间的方法
2015/03/21 PHP
PHP版单点登陆实现方案的实例
2016/11/17 PHP
laravel如何开启跨域功能示例详解
2017/08/31 PHP
Laravel的Auth验证Token验证使用自定义Redis的例子
2019/09/30 PHP
extjs之去除s.gif的影响
2010/12/25 Javascript
JavaScript 和 Java 的区别浅析
2013/07/31 Javascript
jquery实现pager控件示例
2014/04/09 Javascript
javascript鼠标滑动评分控件完整实例
2015/05/13 Javascript
JavaScript动态添加css样式和script标签
2016/07/19 Javascript
详解使用vue实现tab 切换操作
2017/07/03 Javascript
一个简单的node.js界面实现方法
2018/06/01 Javascript
Vue实现textarea固定输入行数与添加下划线样式的思路详解
2018/06/28 Javascript
[01:31:03]DOTA2完美盛典全回顾 见证十五项大奖花落谁家
2017/11/28 DOTA
[01:05:40]VG vs Newbee 2018国际邀请赛小组赛BO2 第二场 8.17
2018/08/20 DOTA
在Python 3中实现类型检查器的简单方法
2015/07/03 Python
详解使用python的logging模块在stdout输出的两种方法
2017/05/17 Python
浅谈Tensorflow模型的保存与恢复加载
2018/04/26 Python
使用 tf.nn.dynamic_rnn 展开时间维度方式
2020/01/21 Python
logging level级别介绍
2020/02/21 Python
python多维数组分位数的求取方式
2020/03/03 Python
PyTorch在Windows环境搭建的方法步骤
2020/05/12 Python
numpy实现RNN原理实现
2021/03/02 Python
英国二手iPhone、音乐、电影和游戏商店:musicMagpie
2018/10/26 全球购物
幼儿教师工作感言
2014/02/14 职场文书
仓库管理员岗位职责
2014/03/19 职场文书
服务型党组织建设典型材料
2014/05/07 职场文书
保护黄河倡议书
2014/05/16 职场文书
模范教师事迹材料
2014/12/16 职场文书
孔庙导游词
2015/02/04 职场文书
2016年春季运动会加油稿
2015/07/22 职场文书
zabbix agent2 监控oracle数据库的方法
2021/05/13 Oracle
React如何创建组件
2021/06/27 Javascript
Windows11里微软已经将驱动程序安装位置A盘删除
2021/11/21 数码科技
mysql 乱码 字符集latin1转UTF8
2022/04/19 MySQL