A网站跳转B网站并传值-----window.open
意思如图：
这里我们做一个名字为A.html和B.html实现该效果的demo，其中用到window.open（）的方式进行传值。
A.html源码：
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>A页面点击a后主跳转</title>
</head>
<style>
div {
width: 400px;
height: 50px;
margin: 100px auto;
}
a {
float: left;
width: 100px;
height: 50px;
line-height: 50px;
font-size: 18px;
text-align: center;
}
a:nth-child(1) {
background: red;
}
a:nth-child(2) {
background: orange;
}
a:nth-child(3) {
background: green;
}
a:nth-child(4) {
background: pink;
}
</style>
<body>
<div>
<a οnclick="ulrHtml(1)">B链接1选项</a>
<a οnclick="ulrHtml(2)">B链接2选项</a>
<a οnclick="ulrHtml(3)">B链接3选项</a>
<a οnclick="ulrHtml(4)">B链接4选项</a>
</div>
<script>
function ulrHtml(num) {
var toUrl = "B.html?" + num
window.open(toUrl);
}
</script>
</body>
</html>
B.html源码：
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>B被跳转的子页面</title>
<script src="http://libs.baidu.com/jquery/1.8.3/jquery.js"></script>
<style>
ul {
width: 400px;
height: 50px;
margin: 100px auto;
}
ul li {
float: left;
width: 100px;
height: 50px;
line-height: 50px;
font-size: 18px;
text-align: center;
}
.on {
background: red;
}
</style>
</head>
<body>
<ul id="tab">
<li>第一项</li>
<li>第二项</li>
<li>第三项</li>
<li>第四项</li>
</ul>
<script>
setTimeout(function(){
var location = window.location.href;
var href = location + "";
var href_part = href.split('?');
var num = (href_part[1]) * 1;
$('#tab li:nth-child(' + num + ')').addClass('on');
});
</script>
</body>
</html>
好了，这时候可以测试下了~~
1836
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
