JavaScript实现同一页面内两个表单互相传值的方法


Posted in Javascript onAugust 12, 2015

本文实例讲述了JavaScript实现同一页面内两个表单互相传值的方法。分享给大家供大家参考。具体如下:

有时候我们在提交表单的时候需要将两个表单的值互相传递,那么如何实现呢?其实很简单,就是用JavaScrip获取任一表单的值,然后赋给另一个,具体可看代码,代码很有意思,也很实用。

运行效果截图如下:

JavaScript实现同一页面内两个表单互相传值的方法

具体代码如下:

<html>
<head>
<title>JavaScript同一页面两个表单互相传值</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
</head>
<script language="JavaScript">
function ok()
{
 document.form2.textfield2.value=document.form1.textfield.value;
}
function ok1()
{
document.form1.textfield.value=document.form2.textfield2.value;
}
</script>
<body>
<form name="form1" method="post" action="">
 <input type="text" name="textfield">
 <input type="button" name="Submit" value="A表单->传值给B表单" onClick="ok()">
</form>
<form name="form2" method="post" action="">
 <input type="text" name="textfield2">
 <input type="button" name="Submit" value="B表单->传值给A表单" onClick="ok1()">
</form>
</body>
</html>

希望本文所述对大家的javascript程序设计有所帮助。

Javascript 相关文章推荐
jQuery 表单验证扩展代码(二)
Oct 20 Javascript
Jquery命名冲突解决的五种方案分享
Mar 16 Javascript
jQuery获取样式中的背景颜色属性值/颜色值
Dec 17 Javascript
js实现百度搜索提示框
Feb 05 Javascript
jQuery插件FusionCharts实现的Marimekko图效果示例【附demo源码】
Mar 24 jQuery
深入理解 webpack 文件打包机制(小结)
Jan 08 Javascript
JavaScript生成指定范围随机数和随机序列的方法
May 05 Javascript
vue用Object.defineProperty手写一个简单的双向绑定的示例
Jul 09 Javascript
vue中将html字符串转换成html后遇到的问题小结
Dec 10 Javascript
详解为生产环境编译Angular2应用的方法
Dec 10 Javascript
《javascript设计模式》学习笔记三:Javascript面向对象程序设计单例模式原理与实现方法分析
Apr 07 Javascript
vue+flask实现视频合成功能(拖拽上传)
Mar 04 Vue.js
JavaScript实现点击单选按钮改变输入框中文本域内容的方法
Aug 12 #Javascript
JavaScript检测并限制复选框选中个数的方法
Aug 12 #Javascript
JavaScript入门基础
Aug 12 #Javascript
js实现将选中值累加到文本框的方法
Aug 12 #Javascript
javascript实现简单的分页特效
Aug 12 #Javascript
JavaScript实现网站访问次数统计代码
Aug 12 #Javascript
jquery+ajax请求且带返回值的代码
Aug 12 #Javascript
You might like
使用 eAccelerator加速PHP代码的方法
2007/09/30 PHP
用php代码限制国内IP访问我们网站
2015/09/26 PHP
Laravel框架使用monolog_mysql实现将系统日志信息保存到mysql数据库的方法
2018/08/16 PHP
PHP中通过getopt解析GNU C风格命令行选项
2019/11/18 PHP
javascript之锁定表格栏位
2007/06/29 Javascript
Prototype中dom对象方法汇总
2008/09/17 Javascript
Javascript 判断客户端浏览器类型代码
2010/03/01 Javascript
js常用代码段整理
2011/11/30 Javascript
javascript 禁用IE工具栏,导航栏等等实现代码
2013/04/01 Javascript
javascript 密码框防止用户粘贴和复制的实现代码
2014/02/17 Javascript
javaScript给元素添加多个class的简单实现
2016/07/20 Javascript
vue 2.0组件与v-model详解
2017/03/27 Javascript
详解用webpack2搭建angular2的项目
2017/06/22 Javascript
Nodejs进阶之服务端字符编解码和乱码处理
2017/09/04 NodeJs
JavaScript实现图片拖曳效果
2017/09/08 Javascript
jquery之基本选择器practice(实例讲解)
2017/09/30 jQuery
JavaScript实现数值自动增加动画
2017/12/28 Javascript
bootstrap table插件动态加载表头
2019/07/19 Javascript
python虚拟环境 virtualenv的简单使用
2020/01/21 Javascript
JS实现判断移动端PC端功能
2020/02/21 Javascript
python 实现插入排序算法
2012/06/05 Python
python冒泡排序算法的实现代码
2013/11/21 Python
Python自定义进程池实例分析【生产者、消费者模型问题】
2016/09/19 Python
Python编程实现生成特定范围内不重复多个随机数的2种方法
2017/04/14 Python
很酷的python表白工具 你喜欢我吗
2019/04/11 Python
python为什么会环境变量设置不成功
2020/06/23 Python
Python OpenCV读取中文路径图像的方法
2020/07/02 Python
通过实例解析Python文件操作实现步骤
2020/09/21 Python
西班牙网上书店:Casa del Libro
2016/11/01 全球购物
Clarks鞋澳大利亚官方网站:Clarks Australia
2019/12/25 全球购物
工厂厂长岗位职责
2013/11/08 职场文书
正科级干部考察材料
2014/05/29 职场文书
深入开展党的群众路线教育实践活动心得体会
2014/11/05 职场文书
求职信格式范文
2015/03/19 职场文书
如何创建一个创建MySQL数据库中的datetime类型
2022/03/21 MySQL
《废话连篇——致新手》——chinapizza
2022/04/05 无线电