如何通过javascript在两个页面之间传值
展开全部
第一个页面中有两个图片,当点击的时候能在第二个页面中获得它的属性值()通过js进行传值:
第一个页面:
[html]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script type="text/javascript">
function test(){
var img1= document.getElementById("img1");
var img2= document.getElementById("img2");
//获得alt的属性
var parm1=img1.getAttribute("alt");
var parm2=img2.getAttribute("alt");
//url
img1.onclick=function(){
var myurl="test2.html"+"?"+"parm1="+parm1;
window.location.assign(myurl);
}
img2.onclick=function(){
var myurl="test2.html"+"?"+"parm2="+parm2;
window.location.assign(myurl);
}
}
</script>
</head>
<body onload="test();">
<img src="1.jpg" id="img1" alt="myimg1">
<img src="2.jpg" id="img2" alt="myimg2">
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script type="text/javascript">
function test(){
var img1= document.getElementById("img1");
var img2= document.getElementById("img2");
//获得alt的属性
var parm1=img1.getAttribute("alt");
var parm2=img2.getAttribute("alt");
//url
img1.onclick=function(){
var myurl="test2.html"+"?"+"parm1="+parm1;
window.location.assign(myurl);
}
img2.onclick=function(){
var myurl="test2.html"+"?"+"parm2="+parm2;
window.location.assign(myurl);
}
}
</script>
</head>
<body onload="test();">
<img src="1.jpg" id="img1" alt="myimg1">
<img src="2.jpg" id="img2" alt="myimg2">
</body>
</html>
第二个页面:
[html]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>test2</title>
<script type="text/javascript">
function getvalue()
{
///test2.html?parm1=myimg1&parm2=myimg2
//获得第一个属性
var url=location.href;
var tmp1=url.split("?")[1];
var tmp2=tmp1.split("&")[0];
var tmp3=tmp2.split("=")[1];
var parm1=tmp3;
//获得第二个属性
/*
var tmp9=url.split("?")[1];
var tmp4=tmp9.split("&")[1];
var tmp5=tmp4.split("=")[1];
var parm2=tmp5;
*/
var inhtml= document.getElementById("inhtml");
inhtml.innerHTML=parm1;
//alert(parm1);
}
</script>
</head>
<body onload="getvalue();">
<h2>测试</h2>
<span id="inhtml"> </span>
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>test2</title>
<script type="text/javascript">
function getvalue()
{
///test2.html?parm1=myimg1&parm2=myimg2
//获得第一个属性
var url=location.href;
var tmp1=url.split("?")[1];
var tmp2=tmp1.split("&")[0];
var tmp3=tmp2.split("=")[1];
var parm1=tmp3;
//获得第二个属性
/*
var tmp9=url.split("?")[1];
var tmp4=tmp9.split("&")[1];
var tmp5=tmp4.split("=")[1];
var parm2=tmp5;
*/
var inhtml= document.getElementById("inhtml");
inhtml.innerHTML=parm1;
//alert(parm1);
}
</script>
</head>
<body onload="getvalue();">
<h2>测试</h2>
<span id="inhtml"> </span>
</body>
</html>
第一个页面:
[html]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script type="text/javascript">
function test(){
var img1= document.getElementById("img1");
var img2= document.getElementById("img2");
//获得alt的属性
var parm1=img1.getAttribute("alt");
var parm2=img2.getAttribute("alt");
//url
img1.onclick=function(){
var myurl="test2.html"+"?"+"parm1="+parm1;
window.location.assign(myurl);
}
img2.onclick=function(){
var myurl="test2.html"+"?"+"parm2="+parm2;
window.location.assign(myurl);
}
}
</script>
</head>
<body onload="test();">
<img src="1.jpg" id="img1" alt="myimg1">
<img src="2.jpg" id="img2" alt="myimg2">
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script type="text/javascript">
function test(){
var img1= document.getElementById("img1");
var img2= document.getElementById("img2");
//获得alt的属性
var parm1=img1.getAttribute("alt");
var parm2=img2.getAttribute("alt");
//url
img1.onclick=function(){
var myurl="test2.html"+"?"+"parm1="+parm1;
window.location.assign(myurl);
}
img2.onclick=function(){
var myurl="test2.html"+"?"+"parm2="+parm2;
window.location.assign(myurl);
}
}
</script>
</head>
<body onload="test();">
<img src="1.jpg" id="img1" alt="myimg1">
<img src="2.jpg" id="img2" alt="myimg2">
</body>
</html>
第二个页面:
[html]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>test2</title>
<script type="text/javascript">
function getvalue()
{
///test2.html?parm1=myimg1&parm2=myimg2
//获得第一个属性
var url=location.href;
var tmp1=url.split("?")[1];
var tmp2=tmp1.split("&")[0];
var tmp3=tmp2.split("=")[1];
var parm1=tmp3;
//获得第二个属性
/*
var tmp9=url.split("?")[1];
var tmp4=tmp9.split("&")[1];
var tmp5=tmp4.split("=")[1];
var parm2=tmp5;
*/
var inhtml= document.getElementById("inhtml");
inhtml.innerHTML=parm1;
//alert(parm1);
}
</script>
</head>
<body onload="getvalue();">
<h2>测试</h2>
<span id="inhtml"> </span>
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>test2</title>
<script type="text/javascript">
function getvalue()
{
///test2.html?parm1=myimg1&parm2=myimg2
//获得第一个属性
var url=location.href;
var tmp1=url.split("?")[1];
var tmp2=tmp1.split("&")[0];
var tmp3=tmp2.split("=")[1];
var parm1=tmp3;
//获得第二个属性
/*
var tmp9=url.split("?")[1];
var tmp4=tmp9.split("&")[1];
var tmp5=tmp4.split("=")[1];
var parm2=tmp5;
*/
var inhtml= document.getElementById("inhtml");
inhtml.innerHTML=parm1;
//alert(parm1);
}
</script>
</head>
<body onload="getvalue();">
<h2>测试</h2>
<span id="inhtml"> </span>
</body>
</html>
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询