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


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 在firebug调试时用console.log的方法
May 10 Javascript
jQuery form插件的使用之处理server返回的JSON, XML,HTML数据
Jan 26 Javascript
JavaScript重载函数实例剖析
May 13 Javascript
浅谈JS中的!=、== 、!==、===的用法和区别
Sep 24 Javascript
Vue实现动态响应数据变化
Apr 28 Javascript
angularjs实现上拉加载和下拉刷新数据功能
Jun 12 Javascript
JavaScript实现图片无缝滚动效果
Jul 07 Javascript
从源码看angular/material2 中 dialog模块的实现方法
Oct 18 Javascript
基于vue.js 2.x的虚拟滚动条的示例代码
Jan 23 Javascript
微信公众平台 客服接口发消息的实现代码(Java接口开发)
Apr 17 Javascript
Easyui 去除jquery-easui tab页div自带滚动条的方法
May 10 jQuery
原生js实现表格翻页和跳转
Sep 29 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
【动漫杂谈】关于《请在T台上微笑》
2020/03/03 日漫
PHP调用Webservice实例代码
2011/07/29 PHP
PHP 图片上传代码
2011/09/13 PHP
使用PHP函数scandir排除特定目录
2014/06/12 PHP
php上传图片之时间戳命名(保存路径)
2014/08/15 PHP
php基于GD库画五星红旗的方法
2015/02/24 PHP
PHP调用.NET的WebService 简单实例
2015/03/27 PHP
表格 隔行换色升级版
2009/11/07 Javascript
Jquery中dialog属性小记
2010/09/03 Javascript
JavaScript的strict模式与with关键字介绍
2014/02/08 Javascript
JavaScript中的pow()方法使用详解
2015/06/15 Javascript
jQuery网页右侧广告跟随滚动代码分享
2020/04/20 Javascript
JavaScript仿微信(电话)联系人列表滑动字母索引实例讲解(推荐)
2017/08/16 Javascript
面包屑导航详解
2017/12/07 Javascript
web前端页面生成exe可执行文件的方法
2018/02/08 Javascript
如何制作一个Node命令行图像识别工具
2018/12/12 Javascript
layer ui 导入文件之前传入数据的实例
2019/09/23 Javascript
vue 解决form表单提交但不跳转页面的问题
2019/10/30 Javascript
Vue3项目打包后部署到服务器 请求不到后台接口解决方法
2020/02/06 Javascript
js实现鼠标滑动到某个div禁止滚动
2020/09/17 Javascript
vue中配置scss全局变量的步骤
2020/12/28 Vue.js
[42:20]Winstrike vs VGJ.S 2018国际邀请赛淘汰赛BO3 第二场 8.23
2018/08/24 DOTA
Python scikit-learn 做线性回归的示例代码
2017/11/01 Python
如何利用Boost.Python实现Python C/C++混合编程详解
2018/11/08 Python
python爬取淘宝商品销量信息
2018/11/16 Python
Python不同目录间进行模块调用的实现方法
2019/01/29 Python
Python图像处理之膨胀与腐蚀的操作
2021/02/07 Python
HTML5文档结构标签
2017/04/21 HTML / CSS
基于MUI框架使用HTML5实现的二维码扫描功能
2018/03/01 HTML / CSS
世界知名接发和假发品牌:Poze Hair
2017/03/08 全球购物
英国豪华真皮和布艺沙发销售网站:Darlings of Chelsea
2018/01/05 全球购物
群众路线学习笔记范文
2014/11/06 职场文书
这样写python注释让代码更加的优雅
2021/06/02 Python
Ruby序列化和持久化存储 Marshal和Pstore介绍
2022/04/18 Ruby
MySQL视图概念以及相关应用
2022/04/19 MySQL
Golang map映射的用法
2022/04/22 Golang