js实现同一页面中，选择不同选项卡，选项卡背景改变，相对应的层显示，刷新不改变
js实现同一页面中，点击不同选项卡，选项卡背景改变，相对应的层显示，刷新后还是所点击的选项卡及对应的层...
js实现同一页面中，点击不同选项卡，选项卡背景改变，相对应的层显示，刷新后还是所点击的选项卡及对应的层
展开
1个回答
展开全部
<!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=gb2312" />
<title>无标题文档</title>
<SCRIPT LANGUAGE="JavaScript">
<!--
function getElementsByClass(object, tag, className) {
var o = object.getElementsByTagName(tag);
for ( var i = 0, n = o.length, ret = []; i < n; i++) {
if (o[i].className == className) ret.push(o[i]);
}
if (ret.length == 1) ret = ret[0];
return ret;
}
function setCookie(c_name,value,expiredays){
var exdate=new Date()
exdate.setDate(exdate.getDate()+expiredays)
document.cookie=c_name+ "=" +escape(value)+
((expiredays==null) ? "" : ";expires="+exdate.toGMTString())
}
function getCookie(c_name){
if (document.cookie.length>0)
{
c_start=document.cookie.indexOf(c_name + "=")
if (c_start!=-1)
{
c_start=c_start + c_name.length+1
c_end=document.cookie.indexOf(";",c_start)
if (c_end==-1) c_end=document.cookie.length
return unescape(document.cookie.substring(c_start,c_end))
}
}
return ""
}
window.onload=function (){
var a=getElementsByClass(document,'a','t')
var divchange=document.getElementById('divchange');;
var color=['333','666','999','bbb','ddd','eee'];
if (getCookie('color')!=''){
divchange.style.backgroundColor=getCookie('color');
}
for (var i=0;i<a.length ; i++)
{
a[i].onclick=function (n){
return function (){
divchange.style.backgroundColor='#'+color[n];
setCookie('color','#'+color[n]);
}
}(i)
}
}
//-->
</SCRIPT>
<style>
.t{
padding:0 10px 5px;
}
#w{
background:#f9f9f9;
}
#wp{
width:368px;
height:394px;
border:3px solid #222222;
}
</style>
</head>
<div id="wp">
<p id="w"><a target="_self" href="javascript://" class='t'>11111</a><a target="_self" href="javascript://" class='t'>22222</a><a target="_self" href="javascript://" class='t'>33333</a><a target="_self" href="javascript://" class='t'>44444</a><a target="_self" href="javascript://" class='t'>55555</a><a target="_self" href="javascript://" class='t'>66666</a></p>
<div id="divchange" style="height:344px ;background:#333" >
<div>
</div>
<body>
</body>
</html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<SCRIPT LANGUAGE="JavaScript">
<!--
function getElementsByClass(object, tag, className) {
var o = object.getElementsByTagName(tag);
for ( var i = 0, n = o.length, ret = []; i < n; i++) {
if (o[i].className == className) ret.push(o[i]);
}
if (ret.length == 1) ret = ret[0];
return ret;
}
function setCookie(c_name,value,expiredays){
var exdate=new Date()
exdate.setDate(exdate.getDate()+expiredays)
document.cookie=c_name+ "=" +escape(value)+
((expiredays==null) ? "" : ";expires="+exdate.toGMTString())
}
function getCookie(c_name){
if (document.cookie.length>0)
{
c_start=document.cookie.indexOf(c_name + "=")
if (c_start!=-1)
{
c_start=c_start + c_name.length+1
c_end=document.cookie.indexOf(";",c_start)
if (c_end==-1) c_end=document.cookie.length
return unescape(document.cookie.substring(c_start,c_end))
}
}
return ""
}
window.onload=function (){
var a=getElementsByClass(document,'a','t')
var divchange=document.getElementById('divchange');;
var color=['333','666','999','bbb','ddd','eee'];
if (getCookie('color')!=''){
divchange.style.backgroundColor=getCookie('color');
}
for (var i=0;i<a.length ; i++)
{
a[i].onclick=function (n){
return function (){
divchange.style.backgroundColor='#'+color[n];
setCookie('color','#'+color[n]);
}
}(i)
}
}
//-->
</SCRIPT>
<style>
.t{
padding:0 10px 5px;
}
#w{
background:#f9f9f9;
}
#wp{
width:368px;
height:394px;
border:3px solid #222222;
}
</style>
</head>
<div id="wp">
<p id="w"><a target="_self" href="javascript://" class='t'>11111</a><a target="_self" href="javascript://" class='t'>22222</a><a target="_self" href="javascript://" class='t'>33333</a><a target="_self" href="javascript://" class='t'>44444</a><a target="_self" href="javascript://" class='t'>55555</a><a target="_self" href="javascript://" class='t'>66666</a></p>
<div id="divchange" style="height:344px ;background:#333" >
<div>
</div>
<body>
</body>
</html>
本回答由提问者推荐
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
