javascript不同页面传值的改进版


Posted in Javascript onSeptember 30, 2008

其实原理也很简单。同样先通过getAttribute判断type属性,捕捉到按钮。然后在按钮onclick时把i通过url传入子页面。

<h2>input1</h2> 
<input type="text" /><input type="submit" /> 
<h2>input2</h2> 
<input type="text" /><input type="submit" /> <script type="text/javascript"><!-- 
var aInput = document.getElementsByTagName("input"); 
for (i = 0 ; i < aInput.length ; i++ ) 
{ 
( 
function (i){ 
if (aInput[i].getAttribute("type") == "submit") 
{ 
aInput[i].onclick = function (){ 
window.open('b.html?'+i,'newwindow','height=100,width=400') 
} 
} 
} 
)(i) 
} 
// --></script>

子页面用slice方法对url进行切分。并使用window.opener方法捕捉到父页面的文本框,进行赋值。 一切就OK了
<h2>openWindow</h2> 
<input type="text" /><input type="submit" /> <script type="text/javascript"><!-- 
var aInput = document.getElementsByTagName("input"); 
for (i = 0 ; i < aInput.length ; i++ ) 
{ 
if (aInput[i].getAttribute("type") == "text") var textboxB = new Object(aInput[i]); 
if (aInput[i].getAttribute("type") == "submit") var btnB = new Object(aInput[i]); 
} 
btnB.onclick = function(){ 
var sTextValue = textboxB.value 
var aInput = window.opener.document.getElementsByTagName("input"); 
var sUrl = document.location; 
var sNo = sUrl.toString().slice(-1) 
window.opener.aInput[sNo-"1"].value = sTextValue 
window.close(); 
} 
// --></script>

还没明白的朋友看一下原理图就知道了
javascript不同页面传值的改进版

Javascript 相关文章推荐
用javascript实现读取txt文档的脚本
Jul 20 Javascript
JavaScript高级程序设计 客户端存储学习笔记
Sep 10 Javascript
javascript游戏开发之《三国志曹操传》零部件开发(三)情景对话中仿打字机输出文字
Jan 23 Javascript
Javascript delete 引用类型对象
Nov 01 Javascript
javascript判断复选框是否选中的方法
Oct 16 Javascript
举例讲解jQuery中可见性过滤选择器的使用
Apr 18 Javascript
Vue数据驱动模拟实现2
Jan 11 Javascript
jQuery Ajax使用FormData上传文件和其他数据后端web.py获取
Jun 11 jQuery
web前端vue之CSS过渡效果示例
Jan 10 Javascript
Next.js实现react服务器端渲染的方法示例
Jan 06 Javascript
Vue.js + Nuxt.js 项目中使用 Vee-validate 表单校验
Apr 22 Javascript
浅谈react useEffect闭包的坑
Jun 08 Javascript
简明json介绍
Sep 28 #Javascript
正则表达式判断是否存在中文和全角字符和判断包含中文字符串长度
Sep 27 #Javascript
Javascript操作select方法大全[新增、修改、删除、选中、清空、判断存在等]
Sep 26 #Javascript
验证用户是否修改过页面的数据的实现方法
Sep 26 #Javascript
不用AJAX和IFRAME,说说真正意义上的ASP+JS无刷新技术
Sep 25 #Javascript
js每次Title显示不同的名言
Sep 25 #Javascript
Js动态创建div
Sep 25 #Javascript
You might like
PHP MYSQL实现登陆和模糊查询两大功能
2016/02/05 PHP
smarty学习笔记之常见代码段用法总结
2016/03/19 PHP
AJAX的使用方法详解
2017/04/29 PHP
PHP 年月日的三级联动实例代码
2017/05/24 PHP
JavaScript自动设置IFrame高度的小例子
2013/06/08 Javascript
jquery图片不完全按比例自动缩小的简单代码
2013/07/29 Javascript
基于JavaScript实现一定时间后去执行一个函数
2015/12/14 Javascript
js针对ip地址、子网掩码、网关的逻辑性判断
2016/01/06 Javascript
javascript中对Date类型的常用操作小结
2016/05/19 Javascript
JS两种类型的表单提交方法实例分析
2016/11/28 Javascript
Vue.js2.0中的变化小结
2017/10/24 Javascript
浅谈React前后端同构防止重复渲染
2018/01/05 Javascript
微信小程序中网络请求缓存的解决方法
2019/12/29 Javascript
如何优雅地取消 JavaScript 异步任务
2020/03/22 Javascript
JS使用正则表达式实现常用的表单验证功能分析
2020/04/30 Javascript
Vue如何实现监听组件原生事件
2020/07/03 Javascript
一文秒懂nodejs中的异步编程
2021/01/28 NodeJs
详解Python的单元测试
2015/04/28 Python
Python类的用法实例浅析
2015/05/27 Python
Python制作爬虫抓取美女图
2016/01/20 Python
python筛选出两个文件中重复行的方法
2018/05/31 Python
Python基于opencv调用摄像头获取个人图片的实现方法
2019/02/21 Python
使用 Python 快速实现 HTTP 和 FTP 服务器的方法
2019/07/22 Python
Python Web程序搭建简单的Web服务器
2019/07/31 Python
python 消除 futureWarning问题的解决
2019/12/25 Python
python绘制动态曲线教程
2020/02/24 Python
在django admin详情表单显示中添加自定义控件的实现
2020/03/11 Python
利用Python批量识别电子账单数据的方法
2021/02/08 Python
Space NK美国站:英国高端美妆护肤商城
2017/05/22 全球购物
工程专业求职自荐书范文
2014/02/18 职场文书
网络宣传方案
2014/03/15 职场文书
《水乡歌》教学反思
2014/04/24 职场文书
信用卡工资证明格式
2014/09/13 职场文书
2015年思想品德教学工作总结
2015/07/22 职场文书
关于运动会的广播稿
2015/08/19 职场文书
mysql创建存储过程及函数详解
2021/12/04 MySQL