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 相关文章推荐
看了就知道什么是JSON
Dec 09 Javascript
EXT中xtype的含义分析
Jan 07 Javascript
js将long日期格式转换为标准日期格式实现思路
Apr 07 Javascript
解决jquery操作checkbox火狐下第二次无法勾选问题
Feb 10 Javascript
jQuery中 attr() 方法使用小结
May 03 Javascript
css如何让浮动元素水平居中
Aug 07 Javascript
js中substring和substr两者区别和使用方法
Nov 09 Javascript
ros::spin() 和 ros::spinOnce()函数的区别及详解
Oct 01 Javascript
js鼠标经过tab选项卡时实现切换延迟
Mar 24 Javascript
vue + typescript + 极验登录验证的实现方法
Jun 27 Javascript
layui table设置某一行的字体颜色方法
Sep 05 Javascript
Element Breadcrumb 面包屑的使用方法
Jul 26 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投票系统的设计和实现分享
2012/09/23 PHP
PHP--用万网的接口实现域名查询功能
2012/12/13 PHP
PHP用mb_string函数库处理与windows相关中文字符及Win环境下开启PHP Mb_String方法
2015/11/11 PHP
thinkPHP框架实现生成条形码的方法示例
2018/06/06 PHP
PDO::_construct讲解
2019/01/27 PHP
Laravel Validator 实现两个或多个字段联合索引唯一
2019/05/08 PHP
PHP创建XML接口示例
2019/07/04 PHP
gearman中worker常驻后台,导致MySQL server has gone away的解决方法
2020/02/27 PHP
JS DOM 操作实现代码
2010/08/01 Javascript
浅谈Javascript嵌套函数及闭包
2010/11/09 Javascript
javascript日期转换 时间戳转日期格式
2011/11/05 Javascript
禁止拷贝网页内容的js代码
2014/01/22 Javascript
详解JavaScript的变量和数据类型
2015/11/27 Javascript
JS随机洗牌算法之数组随机排序
2016/03/23 Javascript
详解javascript事件绑定使用方法
2016/10/20 Javascript
JS实现页面侧边栏效果探究
2021/01/08 Javascript
Python使用Scrapy爬取妹子图
2015/05/28 Python
Python的网络编程库Gevent的安装及使用技巧
2016/06/24 Python
基于python实现高速视频传输程序
2019/05/05 Python
新手入门Python编程的8个实用建议
2019/07/12 Python
Django 实现图片上传和显示过程详解
2019/07/18 Python
css3 给页面加个半圆形导航条主要利用旋转和倾斜样式
2014/02/10 HTML / CSS
纯css3实现的竖形无限级导航
2014/12/10 HTML / CSS
CSS3实现多重边框的方法总结
2016/05/31 HTML / CSS
size?荷兰官方网站:英国高级运动鞋精品店
2020/07/24 全球购物
毕业生自荐信
2013/12/14 职场文书
农村党支部先进事迹
2014/01/14 职场文书
关于打架的检讨书
2014/01/17 职场文书
农民工工资承诺书范文
2014/03/31 职场文书
雏鹰争章活动总结
2014/05/09 职场文书
群众路线教育实践活动批评与自我批评
2014/09/15 职场文书
学习焦裕禄精神践行三严三实心得体会
2014/10/13 职场文书
银行先进个人总结
2015/02/15 职场文书
民警忠诚教育心得体会
2016/01/23 职场文书
PHP设计模式(观察者模式)
2021/07/07 PHP
深入解析Apache Hudi内核文件标记机制
2022/03/31 Servers