html页面跳转传值原生,HTML页面之间跳转传值

1.借助JQuery，通过URL拼接，从而传递数据。

jquery.params.js用于两个HTML网页之间的传值。a.html?name=waley&age=20;b.html页面则可以这样获取：$.query.get("name)。

例如;将a.html页面的数据传递到b.html页面：

a.html：

a页面

$(function(){

name = $("#name").text();

age = $("#age").text();

$("#btn").on("click",function(){

jump1();

});

});

function jump1(){

url = "b.html?name="+name+"&age="+age;//此处拼接内容

window.location.href = url;

}

wey

20

跳转

b.html页面通过$.query.get("name)获取。

b.html:

b页面

$(function(){

getData1();

});

function getData1(){

var name = $.query.get("name");

var age = $.query.get("age");

$("#name").text(name);

$("#age").text(age);

}

2.利用JavaScript Cookies来保存页面之间的信息：

在a.html页面中将数据存入到document.cookie;

a.html：

a页面

$(function(){

name = $("#name").text();

age = $("#age").text();

$("#btn").on("click",function(){

jump2();

});

});

function jump2(){

document.cookie = "name="+name;

document.cookie = "age="+age;

window.location.href = "b.html";

}

wey

20

跳转

在b.html中获取cookie的值，并使用split(';')将值进行切割，获得多个数组,然后循环读取出里面的值；

b.html:

b页面

$(function(){

getData2();

});

function getData2(){

var name=getCookie("name");

var ages = getCookie("age");

if (name!="")

{

$("#name").text(name);

}

if(ages!=""){

$("#age").text(ages);

}

}

//循环得到相应的值

function getCookie(cname)

{

var ss = document.cookie;

var name = cname + "=";

var ca = document.cookie.split(';');

for(var i=0; i

{

var c = ca[i].trim();

if (c.indexOf(name)==0)

return c.substring(name.length,c.length);

}

return "";

}