HTML5 页面跳转和参数传递
标签：html html5 传递参数 页面跳
2016-03-21 19:517970人阅读评论(0)收藏举报
分类：
HTML5
版权声明：本文为博主原创文章，未经博主允许不得转载。
页面跳转：
方法一:
[html]view plaincopy
window.location="http://www.baidu.com";
方法二:
[html]view plaincopy
document.location="http://www.baidu.com";
方法三：
[html]view plaincopy
html前进后退方法：
[html]view plaincopy
JavaScript刷新页面的几种方法：
[html]view plaincopy
1 history.go(0)
2 location.reload()
3location=location
4 location.assign(location)
5 document.execCommand('Refresh')
6 window.navigate(location)
7 location.replace(location)
8document.URL=location.href
HTML5传递参数:
一、 使用Cookie传递参数 ，a页面保存Cookie，b页面读取，代码如下：
页面一：
[html]view plaincopy
a
* {margin:0}
body {text-align:center;min-width:760px}
div {padding:3px 3px 3px 3px}
#main {width:720px;margin:0 auto;text-align:left;margin-top:30px}
#main div span {width:50px}
/***
* @param {string} cookieName Cookie名称
* @param {string} cookieValue Cookie值
* @param {number} nDays Cookie过期天数
*/
function SetCookie(cookieName,cookieValue,nDays) {
/*当前日期*/
vartoday=newDate();
/*Cookie过期时间*/
varexpire=newDate();
/*如果未设置nDays参数或者nDays为0，取默认值1*/
if(nDays== null ||nDays== 0)nDays=1;
/*计算Cookie过期时间*/
expire.setTime(today.getTime() + 3600000 * 24 * nDays);
/*设置Cookie值*/
document.cookie=cookieName+ "=" + escape(cookieValue)
+ ";expires=" + expire.toGMTString();
}
function login() {
varusername= $("user").value;
varpassword= $("pass").value;
/*是否选中7天内无需登录*/
varsave= $("save").checked;
if(username=="abc" &&password=="abc") {
if(save) SetCookie("username",username,7);
else SetCookie("username",username,1);
/*跳转到ex8.html页面*/
document.location="b.htm";
} else {
alert("用户名或密码错误！");
}
}
function $(id) {
return document.getElementById(id);
}
7天内无需登录
页面二：
[html]view plaincopy
b
/***
*读取指定的Cookie值
*@param {string} cookieName Cookie名称
*/
function ReadCookie(cookieName) {
vartheCookie=""+ document.cookie;
varind=theCookie.indexOf(cookieName);
if(ind==-1 ||cookieName=="") return "";
varind1=theCookie.indexOf(';',ind);
if(ind1==-1)ind1=theCookie.length;
/*读取Cookie值*/
return unescape(theCookie.substring(ind+cookieName.length+1,ind1));
}
function $(id) {
return document.getElementById(id);
}
function init() {
varusername=ReadCookie("username");
if(username && username.length>0) {
$("msg").innerHTML="
欢迎光临,"+ username + "!
";} else {
$("msg").innerHTML="请登录";
}
}
二、location.href="index33.html?name=value";方式传递
(1)、
页面一
[html]view plaincopy
function show(){
varresult=document.getElementById("name").value;
location.href="index33.html?name="+result;
}
.input7 {color: #999;width:145px;height:20px;border: 1px solid #CCCCCC; font-size:12px;background-color: #fff;}
页面二:
[html]view plaincopy
function getvalue(name) {
varstr=window.location.search; //location.search是从当前URL的?号开始的字符串
console.log()
if (str.indexOf(name) != -1) {
varpos_start=str.indexOf(name) + name.length + 1;
varpos_end=str.indexOf("&", pos_start);
if (pos_end== -1) {
alert(str.substring(pos_start));
} else {
alert("没有此值~~");
}
}
}
(2)、
页面一：
[html]view plaincopy
function to(){
vargetval=document.getElementById("cc").value;
varaa=document.getElementById("aa").value;
location.href="index22.html?cc="+getval + "&" +"aa="+aa;
}
页面二：
[html]view plaincopy
varthisURL=document.URL;
//分割成字符串
vargetval=thisURL.split('?')[1];
varkeyValue=getval.split('&');
varshowval="所有value 值为：";
for(vari=0;i
varoneKeyValue=keyValue[i];
varoneValue=oneKeyValue.split("=")[1];
showval=showval+ oneValue + ";"
}
function showvalf(){
alert(showval);
document.getElementById('ee').value=showval;
}