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


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 相关文章推荐
css图片自适应大小
Nov 28 Javascript
JS的反射问题
Apr 07 Javascript
JS中怎样判断undefined(比较不错的方法)
Mar 27 Javascript
jQuery实现多级联动下拉列表查询框
Jan 18 Javascript
JavaScript Ajax编程 应用篇
Jul 02 Javascript
BootStrap Table对前台页面表格的支持实例讲解
Dec 22 Javascript
微信小程序 MD5的方法详解及实例代码
Mar 10 Javascript
10道典型的JavaScript面试题
Mar 22 Javascript
微信小程序事件流原理解析
Nov 27 Javascript
javascript实现弹出层效果
Dec 10 Javascript
JavaScript字符和ASCII实现互相转换
Jun 03 Javascript
el-form 多层级表单的实现示例
Sep 10 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通过CURL实现定时任务的图片抓取功能示例
2016/10/03 PHP
PHP基于openssl实现的非对称加密操作示例
2019/01/11 PHP
jquery $(this).attr $(this).val方法使用介绍
2013/10/08 Javascript
nodejs之请求路由概述
2014/07/05 NodeJs
使用不同的方法结合/合并两个JS数组
2014/09/18 Javascript
nodejs中转换URL字符串与查询字符串详解
2014/11/26 NodeJs
JavaScript中this详解
2015/09/01 Javascript
JavaScript切换搜索引擎的导航网页搜索框实例代码
2017/06/11 Javascript
探究react-native 源码的图片缓存问题
2017/08/24 Javascript
基于jquery实现九宫格拼图小游戏
2018/11/30 jQuery
koa+jwt实现token验证与刷新功能
2019/05/30 Javascript
深入剖析JavaScript instanceof 运算符
2019/06/14 Javascript
Vue实现渲染数据后控制滚动条位置(推荐)
2019/12/09 Javascript
快速了解Vue父子组件传值以及父调子方法、子调父方法
2020/07/15 Javascript
[01:54]TI4西雅图DOTA2选手欢迎晚宴 现场报道
2014/07/08 DOTA
[01:17:12]职来职往完美电竞专场
2014/09/18 DOTA
[02:38]2018DOTA2亚洲邀请赛赛前采访-VGJ.T
2018/04/03 DOTA
[48:11]完美世界DOTA2联赛 Magma vs GXR 第二场 11.07
2020/11/10 DOTA
python命令行解析之parse_known_args()函数和parse_args()使用区别介绍
2018/01/24 Python
scrapy spider的几种爬取方式实例代码
2018/01/25 Python
Python实现对文件进行单词划分并去重排序操作示例
2018/07/10 Python
Python字符串逆序的实现方法【一题多解】
2019/02/18 Python
Python 3.8正式发布,来尝鲜这些新特性吧
2019/10/15 Python
让Django的BooleanField支持字符串形式的输入方式
2020/05/20 Python
python 在sql语句中使用%s,%d,%f说明
2020/06/06 Python
Python之Matplotlib文字与注释的使用方法
2020/06/18 Python
澳洲在线厨具商店:Kitchen Style
2018/05/05 全球购物
蒙蒂塞罗商店:Monticello Shop
2018/11/25 全球购物
电影T恤、80年代T恤和80年代服装:TV Store Online
2020/01/05 全球购物
求职自荐信格式
2013/12/04 职场文书
《红军不怕远征难》教学反思
2014/04/14 职场文书
竞选班长演讲稿500字
2014/08/22 职场文书
乡镇一岗双责责任书
2015/01/29 职场文书
如何写好活动总结
2019/06/21 职场文书
2021-4-5课程——SQL Server查询【3】
2021/04/05 SQL Server
Python必备技巧之字符数据操作详解
2022/03/23 Python