JavaScript 页面间传值
转自:http://blog.csdn.net/qq380107165/article/details/7330612
一:JavaScript静态页面值传递之URL篇
能过URL进行传值,把要传递的信息接在URL上。
例:
- 参数传出页面Post01.html
姓名:<input type="text" name="username">
性别:<input type="text" name="sex">
<input type="button" value="传值给Read页面" onclick="Post()"> <script language="javascript" >
function Post() {
//单个值 Read.htm?username=baobao;
//多全值 Read.htm?username=baobao&sex=male;
var url = "Read.html?username="+decodeURI(document.all.username.value);
url += "&sex=" + decodeURI(document.all.sex.value);
location.href = url;
}
</script> - 参数接收页面Read01.html
方法一:
var url=location.search;
var Request = new Object();
if(url.indexOf("?")!=-1)
{
var str = url.substr(1), //去掉?号
aStrs= str.split("&");
for(var i=0;i<aStrs.length;i++)
{
Request[aStrs[i].split("=")[0]]=decodeURIComponent(aStrs[i].split("=")[1]);
}
}
alert('姓名:' + Request["username"]);
alert('性别:' + Request["sex"]);
方法二:封装为Request函数
function Request(url,strName)
{
var strHref = url;
var intPos = strHref.indexOf("?");
var strRight = strHref.substr(intPos + 1);
var arrTmp = strRight.split("&");
for(var i = 0; i < arrTmp.length; i++)
{
var arrTemp = arrTmp[i ].split("=");
if(decodeURIComponent(arrTemp[0]).toUpperCase() == strName.toUpperCase())
return decodeURIComponent(arrTemp[1]);
}
return "";
}
alert('姓名:' + Request(location.search,"username"));
alert('性别:' + Request(location.search,"sex"));
方法三:在String.prototype上添加方法
String.prototype.getQuery = function(name)
{
var reg = new RegExp("(^|&)"+ name+"=([^&]*)(&|$)");
var r = this.substr(this.indexOf("?")+1).match(reg);
if(r!=null) return decodeURIComponent(r[2]);
return null;
}
var str = location.search;
alert('姓名:' + str.getQuery("username"));
alert('性别:' + str.getQuery("sex"));
优点:取值方便.可以跨域.
缺点:值长度有限制
二:JavaScript静态页面值传递之Cookie篇
Cookie是浏览器存储少量命名数据,它与某个特定的网页或网站关联在一起。
Cookie用来给浏览器提供内存,以便脚本和服务器程序可以在一个页面中使用另一个页面的输入数据。
例:
- 参数传出页面Post02.html
<input type="text" name="txt1">
<input type="button" value="Post" id="btn">
<script>
function setCookie(name,value)
{
var Days = 30; //此 cookie 将被保存 30 天
var exp = new Date();
exp.setTime(exp.getTime() +Days*24*60*60*1000);
document.cookie = name +"="+ decodeURI(value) + ";expires=" + exp.toGMTString();
location.href = "Read02.html";//接收页面.
}
var oBtn = document.getElementById('btn');
oBtn.onclick = function(){
setCookie('mycookie',document.all.txt1.value);
}
</script>
- 参数接收页面Read02.html
function getCookie(name)
{
var arr =document.cookie.match(new RegExp("(^|)"+name+"=([^;]*)(;|$)"));
if(arr !=null) return decodeURIComponent(arr[2]); return null;
}
alert(getCookie("mycookie"));优点:可以在同源内的任意网页内访问,生命期可以设置。
缺点:值长度有限制。
三:JavaScript静态页面值传递之Window.open篇
这两窗口之间存在着关系,父窗口parent.html打开子窗口son.html。
子窗口可以通过window.opener指向父窗口,这样可以访问父窗口的对象。
例:
- 参数传出页面parent.html
<input type="text" name="maintext">
<input type="button" value="Open" id="btn">
<script>
var oBtn = document.getElementById('btn');
oBtn.onclick = function(){
// window.open(URL,name,features,replace)
// URL->新窗口地址; name->新窗口的名称; features->新窗口要显示的标准浏览器的特征;
// replace->装载到窗口的 URL 是在窗口的浏览历史中创建一个新条目,还是替换浏览历史中的当前条目
window.open('Read03.html');
}
</script>
- 参数接收页面son.html
//window.open打开的窗口.
//利用opener指向父窗口.
var parentText = window.opener.document.all.maintext.value;
alert(parentText);优点:取值方便,只要window.opener指向父窗口,就可以访问所有对象。不仅可以访问值,还可以访问父窗口的方法,值长度无限制。
缺点:两窗口要存在着关系,就是利用window.open打开的窗口,不能跨域。
JavaScript 页面间传值的更多相关文章
- JAVASCRIPT实现的WEB页面跳转以及页面间传值方法
在WEB页面中,我们实现页面跳转的方法通常是用LINK,BUTTON LINK ,IMG LINK等等,由用户点击某处,然后直接由浏览器帮我们跳转. 但有时候,需要当某事件触发时,我们先做一些操作,然 ...
- mui框架如何实现页面间传值
mui框架如何实现页面间传值 我的传值 listDetail = '<li class="mui-table-view-cell mui-media>">< ...
- iOS页面间传值的方式(Delegate/NSNotification/Block/NSUserDefault/单例)
iOS页面间传值实现方法:1.通过设置属性,实现页面间传值:2.委托delegate方式:3.通知notification方式:4.block方式:5.UserDefault或者文件方式:6.单例模式 ...
- iOS页面间传值的方式(NSUserDefault/Delegate/NSNotification/Block/单例)
iOS页面间传值的方式(NSUserDefault/Delegate/NSNotification/Block/单例) 实现了以下iOS页面间传值:1.委托delegate方式:2.通知notific ...
- 【转】iOS页面间传值的方式(Delegate/NSNotification/Block/NSUserDefault/单例)-- 不错
原文网址:http://www.cnblogs.com/JuneWang/p/3850859.html iOS页面间传值的方式(NSUserDefault/Delegate/NSNotificatio ...
- iOS 页面间传值 之 单例传值 , block 传值
ios 页面间传值有许多,前边已经分享过属性传值和代理传值,今天主要说一下单例传值和 block 传值 单例传值:单例模式一种常用的开发的模式,单例因为在整个程序中无论在何时初始化对象,获取到的都是同 ...
- iOS 页面间传值 之 属性传值,代理传值
手机 APP 运行,不同页面间传值是必不可少,传值的方式有很多(方法传值,属性传值,代理传值,单例传值) ,这里主要总结下属性传值和代理传值. 属性传值:属性传值是最简单,也是最常见的一种传值方式,但 ...
- iOS页面间传值的方式 (Delegate/NSNotification/Block/NSUserDefault/单例)
iOS页面间传值的方式(Delegate/NSNotification/Block/NSUserDefault/单例) iOS页面间传值的方式(NSUserDefault/Delegate/NSN ...
- iOS页面间传值的五种方式总结(Delegate/NSNotification/Block/NSUserDefault/单例)
iOS页面间传值的方式(Delegate/NSNotification/Block/NSUserDefault/单例) iOS页面间传值的方式(NSUserDefault/Delegate/NSNot ...
随机推荐
- python2.7入门---break语句&continue语句&pass空语句
这篇文章记录的就是比较好玩的东西了,也是比较重要的.咱们先来看一下break语句.Python break语句,就像在C语言中,打破了最小封闭for或while循环.break语句用来终止循环 ...
- RHEL-7.1 Server.x86_64 yum源设置为光盘
1.挂载光盘 首先在media目录下创建文件夹CentOS mkdir CentOS 然后将光盘挂载在CentOS下 mount -t iso9660 -o loop /dev/cdrom /medi ...
- Hbase表格设计
Rowkey设计 Region: 基于RowKey的分区,可理解成MySQL的水平切分. 每个Region Server就是Hadoop集群中一台机器上的一个进程. 比如我们的有1-300号的RowK ...
- LINUX目录的意思
Linux系统/目录下的文件夹里面分别是以下内容: /usr 包含所有的命令和程序库.文档和其他文件,还包括当前linux发行版的主要应用程序 /var 包含正在操作的文件,还有记录文件.加密文件.临 ...
- mysql 查询当月天数
SELECT day(LAST_DAY('2018-02-01')) 思路: 先通过LAST_DAY() 查找当月最后一天,然后通过day()返回天数.
- 【个人笔记】关于C++小数的处理
无论是C-Style还是C++-Style的输出,小数都会四舍五入.如果想要截断两种比较好的方法.第一种:利用sscanf输出成字符串,再人为地putchar().第二种:已知钦定保留6位小数,那么可 ...
- Swiper 常用功能及配置清单
内容来源于Swiper中文在线(http://www.swiper.com.cn/),由于Swiper功能强大,这里只将常用的功能列出来,方便开发. 这里统一使用Swiper最新版 4.0做为演示! ...
- 领扣[LeetCode]从零开始[使用C++][1,10]
0.序 以后不做后端开发是不是就用不到C++了?真香.话不多说,我已经躺倒在第一题上了.不贴题目了,持续更新. 1.两数之和 原文:https://www.cnblogs.com/grandyang/ ...
- BZOJ 3779 重组病毒 LCT+线段树(维护DFS序)
原题干(由于是权限题我就直接砸出原题干了,要看题意概述的话在下面): Description 黑客们通过对已有的病毒反编译,将许多不同的病毒重组,并重新编译出了新型的重组病毒.这种病毒的繁殖和变异能力 ...
- c# 生成dll
进入项目属性栏里,选择输出类型为类库.