为什么setInterval会报错is not defined？
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>#</title>
<style type="text/css">
.cl{content: "";display: block;clear: both;zoom:1;}
.box{background: #cff;width: 300px;height: 200px;position: absolute;top: 50%;left: 50%;margin-left: -150px;margin-top: -100px;}
.box>div{float: left;}
.box .left,.box .right{width: 50px;height: 200px;}
.box .left li,.box .right li{width: 50px;height: 49px;line-height: 49px;text-align: center;cursor: pointer; border-bottom: 1px solid #ccc;list-style: none;}
.box .active{background: #ccf;}
.box .img{width: 200px;height: 200px;background: #ccc;}
</style>
</head>
<body>
<div class="box cl">
<div>
<li>1</li>
<li>2</li>
<li>3</li>
<li style='height: 50px;border: none;'>4</li>
</div>
<div></div>
<div>
<li>5</li>
<li>6</li>
<li>7</li>
<li style='height: 50px;border: none;'>8</li>
</div>
</div>
<script type="text/javascript">
var aDiv=document.getElementsByClassName('box');
var arr=['#f00','#0f0','#00f'];
function Tab(aDiv){
var aDiv1=aDiv.getElementsByTagName('div');
var aLi=aDiv.getElementsByTagName('li');
for(var i=0;i<aLi.length;i++){
aLi[i].index=i;
aLi[i].onmouseover=function(){
num=this.index;
clearInterval(timer);
}
aLi[i].onmouseout=function(){
timer=setInterVal(function(){
if(num==aLi.length){
num=0;
}else{
num++;
aLi[num-1].className='';
aLi[num].className='active';
aDiv1[1].style.background=arr[i%arr.length];
}
},1000);
}
}
var num=0;
var timer=setInterVal(function(){
if(num==aLi.length){
num=0;
}else{
num++;
for(var i=0;i<aLi.length;i++){
aLi[i].className='';
}
aLi[num].className='active';
aDiv1[1].style.background=arr[i%arr.length];
}
},1000);
}
for(var i=0;i<aDiv.length;i++){
Tab(aDiv[i]);
}
</script>
</body>
</html>
kolog1回答
-
一诺yinol
setInterVal没有定义！
随时随地看视频慕课网APP
相关分类
JavaScript