我得js的clearIterva无效。。为什么T T
function $(id)
{
return typeof id=='string'?document.getElementById(id):id;
}
window.onload=tab;
function tab(){
var index=0;
var timer=null;
var lis=$('notice-tit').getElementsByTagName('li');
var divs=$('notice-con').getElementsByTagName('div');
for(var i=0;i<lis.length;i++)
{
lis[i].id=i;
lis[i].onmouseover=function(){
clearInterval(timer);
}
}
time=setInterval(function(){
//高亮显示当前页签
for(var j=0;j<lis.length;j++){
lis[j].className='';
divs[j].style.display='none';
}
divs[index].style.display='block';
lis[index].className='select';
index++;
if(index==lis.length)
index=0;
},2000);
}
<!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" />
<link type="text/css" rel="stylesheet" href="css/style.css" />
<script type="text/javascript" src="js/javascript.js"></script>
<title>Tab切换</title>
</head>
<body>
<div id="notice" class="notice">
<div id="notice-tit" class="notice-tit">
<ul>
<li class="select">
<a href="#">公告</a>
</li>
<li>
<a href="#">规则</a>
</li>
<li>
<a href="#">论坛</a>
</li>
<li>
<a href="#">安全</a>
</li>
<li>
<a href="#">公益</a>
</li>
</ul>
</div>
<div class="notice-con" id="notice-con">
<div class="mod" style="display:block">
<ul>
<li>
<span>[
<a href="#">通知</a>
]
</span>
<a href="#">哈。。。。。。。。</a>
</li>
<li>
<span>[
<a href="#">聚焦</a>
]
</span>
<a href="#">呵呵。。。。。。。。。。。</a>
</li>
<li>
<span>[
<a href="#">滥用</a>
]
</span>
<a href="#">好烦撒打算开店加拉斯角度来看撒娇的啦睡觉</a>
</li>
<li>
<span>[
<a href="#">无聊</a>
]
</span>
<a href="#">加爱上大手大脚啊数控刀具阿拉斯加油</a>
</li>
</ul>
</div>
<div class="mod" style="display:none">
<ul>
<li>
<span>[
<a href="#">通知</a>
]
</span>
<a href="#">哈哈</a>
</li>
<li>
<span>[
<a href="#">聚焦</a>
]
</span>
<a href="#">呵呵</a>
</li>
<li>
<span>[
<a href="#">滥用</a>
]
</span>
<a href="#">好烦</a>
</li>
<li>
<span>[
<a href="#">无聊</a>
]
</span>
<a href="#">加油</a>
</li>
</ul>
</div>
<div class="mod" style="display:none">
<ul>
<li>
<span>[
<a href="#">通知</a>
]
</span>
<a href="#">哈哈</a>
</li>
<li>
<span>[
<a href="#">聚焦</a>
]
</span>
<a href="#">呵呵</a>
</li>
<li>
<span>[
<a href="#">滥用</a>
]
</span>
<a href="#">好烦</a>
</li>
<li>
<span>[
<a href="#">无聊</a>
]
</span>
<a href="#">加油</a>
</li>
</ul>
</div>
<div class="mod" style="display:none">
<ul>
<li>
<span>[
<a href="#">通知</a>
]
</span>
<a href="#">哈哈</a>
</li>
<li>
<span>[
<a href="#">聚焦</a>
]
</span>
<a href="#">呵呵</a>
</li>
<li>
<span>[
<a href="#">滥用</a>
]
</span>
<a href="#">好烦</a>
</li>
<li>
<span>[
<a href="#">无聊</a>
]
</span>
<a href="#">加油</a>
</li>
</ul>
</div>
<div class="mod" style="display:none">
<ul>
<li>
<span>[
<a href="#">通知</a>
]
</span>
<a href="#">哈哈</a>
</li>
<li>
<span>[
<a href="#">聚焦</a>
]
</span>
<a href="#">呵呵</a>
</li>
<li>
<span>[
<a href="#">滥用</a>
]
</span>
<a href="#">好烦</a>
</li>
<li>
<span>[
<a href="#">无聊</a>
]
</span>
<a href="#">加油</a>
</li>
</ul>
</div>
</div>
</body>
</html>