静态页面的值传递(三部曲)


Posted in Javascript onSeptember 25, 2006

这两窗口之间存在着关系.父窗口parent.htm打开子窗口son.htm
子窗口可以通过window.opener指向父窗口.这样可以访问父窗口的对象.

优点:取值方便.只要window.opener指向父窗口,就可以访问所有对象.
       不仅可以访问值,还可以访问父窗口的方法.值长度无限制.
缺点:两窗口要存在着关系.就是利用window.open打开的窗口.不能跨域.

Post.htm

<input type=text name=maintext>
<input type=button onclick="window.open('Read.htm')" value="Open">

Read.htm

<script language="javascript" >
//window.open打开的窗口.
//利用opener指向父窗口.
var parentText = window.opener.document.all.maintext.value;
alert(parentText);
</script>

利用Cookie.

Cookie是浏览器存储少量命名数据.
它与某个特定的网页或网站关联在一起.
Cookie用来给浏览器提供内存,
以便脚本和服务器程序可以在一个页面中使用另一个页面的输入数据.

优点:可以在同源内的任意网页内访问.生命期可以设置.
缺点:值长度有限制.

Post.htm

<input type="text" name="txt1">
<input type="button" onclick="setCookie('baobao',document.all.txt1.value)" value="Post">
<script language="javascript" >
function setCookie(name,value)
{
/*
 *--------------- setCookie(name,value) -----------------
 * setCookie(name,value) 
 * 功能:设置得变量name的值
 * 参数:name,字符串;value,字符串.
 * 实例:setCookie('username','baobao')
 *--------------- setCookie(name,value) -----------------
 */
    var Days = 30; //此 cookie 将被保存 30 天
    var exp  = new Date();
    exp.setTime(exp.getTime() + Days*24*60*60*1000);
    document.cookie = name + "="+ escape (value) + ";expires=" + exp.toGMTString();
    location.href = "Read.htm"; //接收页面.
}
</script>

Read.htm

<script language="javascript" >
function getCookie(name)
{
/*
 *--------------- getCookie(name) -----------------
 * getCookie(name)
 * 功能:取得变量name的值
 * 参数:name,字符串.
 * 实例:alert(getCookie("baobao"));
 *--------------- getCookie(name) -----------------
 */
    var arr = document.cookie.match(new RegExp("(^| )"+name+"=([^;]*)(;|$)"));
    if(arr !=null) return unescape(arr[2]); return null;
}
alert(getCookie("baobao"));
</script>

 URL篇

能过URL进行传值.把要传递的信息接在URL上.

优点:取值方便.可以跨域.
缺点:值长度有限制.

Post.htm

<input type="text" name="username">
<input type="text" name="sex">
<input type="button" onclick="Post()" value="Post">
<script language="javascript" >
function Post()
{
    //单个值 Read.htm?username=baobao;
    //多全值 Read.htm?username=baobao&sex=male;
    url = "Read.htm?username="+escape(document.all.username.value);
    url += "&sex=" + escape(document.all.sex.value);
    location.href=url;
}
</script>

Read.htm

<script language="javascript" >
/*
 *--------------- Read.htm -----------------
 * Request[key]
 * 功能:实现ASP的取得URL字符串,Request("AAA")
 * 参数:key,字符串.
 * 实例:alert(Request["AAA"])
 *--------------- Request.htm -----------------
 */
var url=location.search;
var Request = new Object();
if(url.indexOf("?")!=-1)
{
    var str = url.substr(1)  //去掉?号
    strs = str.split("&");
    for(var i=0;i<strs.length;i++)
    {
        Request[strs[i].split("=")[0]]=unescape(strs[i].split("=")[1]);
    }
}
alert(Request["username"])
alert(Request["sex"])
</script>

Javascript 相关文章推荐
Javascript实例教程(19) 使用HoTMetal(3)
Dec 23 Javascript
jquery ajax 局部无刷新更新数据的实现案例
Feb 08 Javascript
分享20款美化网站的 jQuery Lightbox 灯箱插件
Oct 10 Javascript
Jquery获取第一个子元素简单实例
Jun 02 Javascript
浅析Jquery操作select
Dec 13 Javascript
js操作浏览器的参数方法
Jan 21 Javascript
JS获取数组中出现次数最多及第二多元素的方法
Oct 27 Javascript
webpack之devtool详解
Feb 10 Javascript
详解javascript对数组和json数组的操作
Apr 15 Javascript
小程序实现订单倒计时功能
Apr 23 Javascript
Node.js中Koa2在控制台输出请求日志的方法示例
May 02 Javascript
Vue2.0使用嵌套路由实现页面内容切换/公用一级菜单控制页面内容切换(推荐)
May 08 Javascript
关于Blog顶部的滚动导航条代码
Sep 25 #Javascript
初学prototype,发个JS接受URL参数的代码
Sep 25 #Javascript
浅谈JavaScript中面向对象技术的模拟
Sep 25 #Javascript
理解JavaScript中的事件
Sep 23 #Javascript
Valerio 发布了 Mootools
Sep 23 #Javascript
prototype.js的Ajax对象
Sep 23 #Javascript
在Javascript中为String对象添加trim,ltrim,rtrim方法
Sep 22 #Javascript
You might like
提高PHP编程效率 引入缓存机制提升性能
2010/02/15 PHP
PHP引用(&amp;)各种使用方法实例详解
2014/03/20 PHP
分享php多功能图片处理类
2016/05/15 PHP
php实现微信扫码自动登陆与注册功能
2016/09/22 PHP
Avengerls vs Newbee BO3 第二场2.18
2021/03/10 DOTA
关于JavaScript的gzip静态压缩方法
2007/01/05 Javascript
DD_belatedPNG,IE6下PNG透明解决方案(国外)
2010/12/06 Javascript
JQuery中dataGrid设置行的高度示例代码
2014/01/03 Javascript
jQuery查看选中对象HTML代码的方法
2016/06/17 Javascript
angularjs 源码解析之scope
2016/08/22 Javascript
node.js 和HTML5开发本地桌面应用程序
2016/12/13 Javascript
ReactNative 之FlatList使用及踩坑封装总结
2017/11/29 Javascript
jQuery常见的遍历DOM操作详解
2018/09/05 jQuery
vue配置接口域名方法总结
2019/05/12 Javascript
[04:04]DOTA2亚洲邀请赛比赛场馆&酒店全攻略
2017/03/23 DOTA
python查询mysql中文乱码问题
2014/11/09 Python
通过mod_python配置运行在Apache上的Django框架
2015/07/22 Python
Python机器学习之决策树算法实例详解
2017/12/06 Python
Python数据结构与算法之二叉树结构定义与遍历方法详解
2017/12/12 Python
Python符号计算之实现函数极限的方法
2019/07/15 Python
详解Python在使用JSON时需要注意的编码问题
2019/12/06 Python
django rest framework serializers序列化实例
2020/05/13 Python
纯CSS实现聊天框小尖角、气泡效果
2014/04/04 HTML / CSS
css3的过滤效果简单实例
2016/08/03 HTML / CSS
HTML5声音录制/播放功能的实现代码
2018/05/03 HTML / CSS
英国优质家居用品网上品牌:URBANARA
2018/06/01 全球购物
澳大利亚工具仓库:Tools Warehouse
2018/10/15 全球购物
营销主管自我评价怎么写
2013/09/19 职场文书
2014年迎新年联欢会活动策划方案
2014/02/26 职场文书
初中班主任寄语
2014/04/04 职场文书
测绘工程专业求职信
2014/07/15 职场文书
2014年国庆晚会主持词
2014/09/19 职场文书
2014年作风建设工作总结
2014/10/29 职场文书
MySQL Threads_running飙升与慢查询的相关问题解决
2021/05/08 MySQL
详解Go语言运用广度优先搜索走迷宫
2021/06/23 Python
python 学习GCN图卷积神经网络
2022/05/11 Python