`

javascript表单之间的数据传递!

 
阅读更多
关键词javascript

这是我第一次发的文章,仅作测试用,刚刚才玩BLOG,所以很多东东不会。故在CSDN摘了以下人兄的文章。得罪之处,多多见谅。

---------------------------------------------

javascript表单之间的数据传递! 选择自 itfly 的 Blog

今天有朋友问我关于用JAVASCRIPT来进行页面各表单之间的数据传递的问题,我以前也写过,不过从来没有注意,今天总结了一下,希望能够给大家一些帮助,也帮助我总结以前学过,用过的知识。

一,最简单的就是同一个网页里的表单的数据传递。

举个实例,一个网页上有两个表单,每个表单里一个文本框,一个按钮。点按钮互相对操作对方的文本框的值。我们举的例子是把一个文本框付给另一个文本框。具体的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---------&gt;2" onClick="ok()">
</form>

<form name="form2" method="post" action="">
<input type="text" name="textfield2">
<input type="button" name="Submit" value="2-----&gt;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_表单之间的数据传递

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

    今天有朋友问我关于用JAVASCRIPT来进行页面各表单之间的数据传递的问题,我以前也写过,不过从来没有注意,今天总结了一下,希望能够给大家一些帮助,也帮助我总结以前学过,用过的知识。

    常用web数据传递

    JSP页面间传递参数是经常需要使用到的功能,有时还需要多个JSP页面间传递参数。对JSP、JAVASCRIPT、SERVLET之间数据传递的总结

    android获取html表单数据

    利用javascript相互传递参数 间接获取表单数据

    JavaScript 实例 精粹 整理

    包括:11种用...CSS的常用技巧、IP地址验证、JavaScript Web页面内容导出到Excel、javascript表单之间的数据传递 、Javascript实现广告页面的定时关闭、一百多个JS小技巧、Javascript实现浏览器菜单命令等等。

    JavaScript编程带你一步走!

    java从入门到精通,javascrip简介, javascript对象机制 , java script 对象处理 , 使用技巧 , 表单间的数据传递

    【JavaScript源代码】Vue动态表单的应用详解.docx

    并且能够在外部得到渲染出来的表单数据,从而做一个入库操作。 v-model的理解 vue-model相当于给表单元素传递一个value,外部监听input事件。所以我们自己封装表单组件的时候也是可以传递一个value值,监听input...

    JavaScript详解(第2版)

     13.7.4 将事件传递给JavaScript函数   13.7.5 鼠标坐标   13.7.6 按键事件   13.8 处理事件的脚本模型   13.9 应知应会   练习   第14章 CSS与JavaScript   14.1 什么是CSS   14.2 什么是...

    JavaScript经典实例

     6.3把复杂的数据对象传递给函数  6.4创建一个动态运行时函数  6.5把一个函数当做参数传递给另一个函数  6.6实现递归算法  6.7创建能够记住其状态的函数  6.8使用一个通用的科里化函数提高应用程序性能  6.9...

    JavaScript基础教程第8版

    书中从JavaScript语言基础开始,分别讨论了图像、框架、浏览器窗口、表单、正则表达式、用户事件和cookie,并在上一版的基础上新增了两章,讲述jQuery框架的基础知识。本书不仅介绍了基础知识和使用方法,也深入探讨...

    JavaScript完全自学宝典 源代码

    示例描述:介绍JavaScript与表单控件。 6.1.html JavaScript获取文本框的值。 6.2.html JavaScript控制文本框。 6.3.html 文本框的JavaScript特效。 6.4.html 获取select元素的值。 6.5....

    javascript 使用手册

    Java的源代码在传递到客户端执行之前,必须经过编译,因而客户端上必须具有相应平台上的仿真器或解释器,它可以通过编译器或解释器实现独立于某个特定的平台编译代码的束缚。JavaScript是一种解释性编程语言,其源...

    JavaScript权威指南(第6版)

    《JavaScript权威指南(第6版)》主要讲述的内容涵盖JavaScript语言本身,以及Web浏览器所实现的JavaScript API。本书第6版涵盖了HTML5和ECMAScript 5,很多章节完全重写,增加了当今Web开发的最佳实践的内容,新增...

    源文件程序天下JAVASCRIPT实例自学手册

    1.2.1 表单数据合法性验证 1.2.2 页面特效 1.2.3 交互式菜单 1.2.4 动态页面 1.2.5 数值计算 1.3 JavaScript编程起步 1.3.1 “Hello World!”程序 1.3.2 选择JavaScript脚本编辑器 1.4 如何引入JavaScript脚本代码 ...

    JS多个表单数据提交下的serialize()应用实例分析

    本文实例讲述了JS多个表单数据提交下的serialize()应用。分享给大家供大家参考,具体如下: 在实际开发场景中,难免遇到需要多个表单的数据传递问题。 之所以要进行多表单的数据传递是因为可以进行数据分组,便于...

    JavaScript权威指南(第6版)中文文字版

    他和妻子和孩子一起生活在西雅图和温哥华之间的美国太平洋西北海岸。 目录 前言 1 第1章 javascript概述 5 1.1 javascript语言核心 8 1.2 客户端javascript 12 第一部分 javascript 语言核心 第2章 词法结构 25 2.1...

    程序天下:JavaScript实例自学手册

    1.25 使用JavaScript传递页面参数 1.26 页面被冻结 第 2章 按钮特效 2.1 页面刷新按钮 2.2 按回车调用登录按钮 2.3 动态创建按钮 2.3 平面按钮 2.4 按钮的嵌入效果 2.5 按钮改变状态栏信息 2.6 定义按钮的热键 2.7 ...

    JavaScript权威指南(第6版)(中文版)

    《JavaScript权威指南(第6版)》主要讲述的内容涵盖JavaScript语言本身,以及Web浏览器所实现的JavaScript API。本书第6版涵盖了HTML5和ECMAScript 5,很多章节完全重写,增加了当今Web开发的最佳实践的内容,新增...

    疯狂HTML 5+CSS 3+JavaScript讲义(第2版)+源代码

    19.1 跨文档消息传递 613 19.2 使用WebSocket与服务器通信 621 19.3 使用Server-Sent Events API 630 19.4 使用Beacon 635 19.5 本章小结 636 第20章 HTML 5的疯狂俄罗斯方块 637 20.1 俄罗斯方块简介 638 ...

Global site tag (gtag.js) - Google Analytics