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 相关文章推荐
Ext javascript建立超链接,进行事件处理的实现方法
Mar 22 Javascript
Javascript延迟执行实现方法(setTimeout)
Dec 30 Javascript
基于javascript实现窗口抖动效果
Jan 03 Javascript
详解js的事件处理函数和动态创建html标记方法
Dec 16 Javascript
输入框点击时边框变色效果的实现方法
Dec 26 Javascript
jQuery和CSS仿京东仿淘宝列表导航菜单
Jan 04 Javascript
javascript中BOM基础知识总结
Feb 14 Javascript
ES6新特性之字符串的扩展实例分析
Apr 01 Javascript
JavaScript面向对象精要(下部)
Sep 12 Javascript
vue.js 实现评价五角星组件的实例代码
Aug 13 Javascript
详解vuex数据传输的两种方式及this.$store undefined的解决办法
Aug 26 Javascript
vue2路由基本用法实例分析
Mar 06 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
Zend Studio 无法启动的问题解决方法
2008/12/04 PHP
PHP学习笔记 (1) 环境配置与代码调试
2011/06/19 PHP
php并发对MYSQL造成压力的解决方法
2013/02/21 PHP
PHP 面向对象程序设计(oop)学习笔记 (四) - 异常处理类Exception
2014/06/12 PHP
Yii配置文件用法详解
2014/12/04 PHP
PHP中使用php://input处理相同name值的表单数据
2015/02/03 PHP
thinkphp多表查询两表有重复相同字段的完美解决方法
2016/09/22 PHP
php 二维数组时间排序实现代码
2016/11/19 PHP
脚本吧 - 幻宇工作室用到js,超强推荐expand.js
2006/12/23 Javascript
获取offsetTop和offsetLeft值的js代码(兼容)
2013/04/16 Javascript
网站如何做到完全不需要jQuery也可以满足简单需求
2013/06/27 Javascript
jQuery extend 的简单实例
2013/09/18 Javascript
jquery将一个表单序列化为一个对象的方法
2014/01/03 Javascript
js 显示base64编码的二进制流网页图片
2014/04/04 Javascript
分享一则JavaScript滚动条插件源码
2015/03/03 Javascript
javascript实现获取图片大小及图片等比缩放的方法
2016/11/24 Javascript
jQuery:unbind方法的使用详解
2017/08/14 jQuery
详解Vue webapp项目通过HBulider打包原生APP
2018/06/29 Javascript
angular 服务的单例模式(依赖注入模式下)详解
2018/10/22 Javascript
小程序实现横向滑动日历效果
2019/10/21 Javascript
Python算术运算符实例详解
2017/05/31 Python
python实现公司年会抽奖程序
2019/01/22 Python
python系列 文件操作的代码
2019/10/06 Python
详解Python中的format格式化函数的使用方法
2019/11/20 Python
运行tensorflow python程序,限制对GPU和CPU的占用操作
2020/02/06 Python
PyInstaller将Python文件打包为exe后如何反编译(破解源码)以及防止反编译
2020/04/15 Python
Django Path转换器自定义及正则代码实例
2020/05/29 Python
基于HTML5+Webkit实现树叶飘落动画
2017/12/28 HTML / CSS
Steve Madden官网:美国鞋类品牌
2017/01/29 全球购物
大课间体育活动方案
2014/03/12 职场文书
青年文明号服务承诺
2014/03/31 职场文书
中学生励志演讲稿
2014/04/26 职场文书
煤矿安全协议书
2014/08/20 职场文书
质量月活动总结
2014/08/26 职场文书
Python爬虫之用Xpath获取关键标签实现自动评论盖楼抽奖(二)
2021/06/07 Python
python内置模块之上下文管理contextlib
2022/06/14 Python