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


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 相关文章推荐
jquery淡化版banner异步图片文字效果切换图片特效
Apr 08 Javascript
jQuery中的height innerHeight outerHeight区别示例介绍
Jun 15 Javascript
js随机生成网页背景颜色的方法
Feb 26 Javascript
模板视图和AngularJS之间冲突的解决方法
Nov 22 Javascript
微信小程序开发之相册选择和拍照详解及实例代码
Feb 22 Javascript
浅谈vue的iview列表table render函数设置DOM属性值的方法
Sep 30 Javascript
vue2.0 兄弟组件(平级)通讯的实现代码
Jan 15 Javascript
pace.js和NProgress.js两个加载进度插件的一点小总结
Jan 31 Javascript
Vue中多元素过渡特效的解决方案
Feb 05 Javascript
vue+koa2搭建mock数据环境的详细教程
May 18 Javascript
解决vue自定义指令导致的内存泄漏问题
Aug 04 Javascript
解决js中的setInterval清空定时器不管用问题
Nov 17 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
Linux系统递归生成目录中文件的md5的方法
2015/06/29 PHP
基于PHP如何把汉字转化为拼音
2015/12/11 PHP
4种PHP异步执行的常用方式
2015/12/24 PHP
php如何修改SESSION的生存存储时间的实例代码
2017/07/05 PHP
validator验证控件使用代码
2010/11/23 Javascript
关于JavaScript中var声明变量作用域的推断
2010/12/16 Javascript
JQuery扩展插件Validate 3通过参数设置错误信息
2011/09/05 Javascript
使用jQuery实现的网页版的个人简历(可换肤)
2013/04/19 Javascript
jquery ready函数、css函数及text()使用示例
2013/09/27 Javascript
js仿百度贴吧验证码特效实例代码
2014/01/16 Javascript
jQuery动态添加及删除表单上传元素的方法(附demo源码下载)
2016/01/15 Javascript
jquery实现垂直和水平菜单导航栏
2020/08/27 Javascript
jQuery学习笔记——jqGrid的使用记录(实现分页、搜索功能)
2016/11/09 Javascript
WebView启动支付宝客户端支付失败的问题小结
2017/01/11 Javascript
jQuery+C#实现参数RSA加密传输功能【附jsencrypt.js下载】
2017/06/26 jQuery
详解vue-admin和后端(flask)分离结合的例子
2018/02/12 Javascript
Vue+Webpack完美整合富文本编辑器TinyMce的方法
2018/11/30 Javascript
JavaScript碰撞检测原理及其实现代码
2020/03/12 Javascript
VSCode搭建React Native环境
2020/05/07 Javascript
[06:53]2018DOTA2国际邀请赛寻真——为复仇而来的Newbee
2018/08/15 DOTA
浅谈Python的文件类型
2016/05/30 Python
Python实现获取汉字偏旁部首的方法示例【测试可用】
2018/12/18 Python
Python实现socket非阻塞通讯功能示例
2019/11/06 Python
python import 上级目录的导入
2020/11/03 Python
土耳其时尚购物网站:Morhipo
2017/09/04 全球购物
Solaris操作系统的线程机制
2015/07/28 面试题
花店创业计划书范文
2014/02/07 职场文书
运动会1000米加油稿
2015/07/21 职场文书
党员反腐倡廉学习心得体会
2015/08/15 职场文书
《假如》教学反思
2016/02/17 职场文书
一波干货,会议主持词开场白范文
2019/05/06 职场文书
Python办公自动化之Excel(中)
2021/05/24 Python
python实现A*寻路算法
2021/06/13 Python
spring cloud 配置中心客户端启动遇到的问题
2021/09/25 Java/Android
Python中的turtle画箭头,矩形,五角星
2022/03/16 Python
Windows Server 2012 R2 磁盘分区教程
2022/04/29 Servers