猿问

js执行顺序问题

Document
width:100%">
*{
padding:0;
margin:0;
list-style:none;
}
.list.white{
background:#fff
}
.list{
overflow:hidden;
position:absolute;
top:500px;
left:430px;
z-index:10
}
.listli{
background:rgba(255,255,255,.3);
border:1pxsolid#fff;
border-radius:50%;
width:15px;
height:15px;
float:left;
margin:5px20px;
}
.wrap{
width:500px;
height:500px;
margin:10pxauto;
overflow:hidden;
}
.wrap_div{
left:0px;
width:2000px;
height:500px;
}
.wrap_divdiv{
float:left;
width:500px;
height:500px;
position:relative;
transition:opacity500msease-in-out;
}
.wrap_div_one{
background:url(https://m.360buyimg.com/babel/jfs/t13342/35/2396024346/99047/e45736fb/5a56bf6eN8cc15233.jpg)no-repeat;
background-size:500px500px;
left:0;
opacity:1;
z-index:1
}
.wrap_div_two{
background:url(https://m.360buyimg.com/babel/jfs/t16165/207/1607854073/57122/3438f9c5/5a5ece4fN9efbf994.jpg)no-repeat;
background-size:500px500px;
left:-500px;
opacity:0;
z-index:0
}
.wrap_div_three{
background:url(https://img1.360buyimg.com/da/jfs/t17290/105/25936701/79615/ceb9025a/5a5830edNb29eb37c.jpg)no-repeat;
background-size:500px500px;
left:-1000px;
opacity:0;
z-index:0
}
.wrap_div_four{
background:url(https://m.360buyimg.com/babel/jfs/t13342/35/2396024346/99047/e45736fb/5a56bf6eN8cc15233.jpg)no-repeat;
background-size:500px500px;
left:-1500px;
opacity:0;
z-index:0
}
$(document).ready(function(){
varval=0;
vartimer;
functionmove(){
$('.wrap_divdiv').css({opacity:0,zIndex:0});
$('.listli').removeClass('white');
val++;
***if(val==3){
$('.listli').eq(0).addClass('white');
}elseif(val>3){
val=1;
}
$('.listli').eq(val).addClass('white');***
$('.wrap_divdiv').eq(val).css({opacity:1,zIndex:1});
//$('.wrap_div').css({left:val*500*-1});
timer=setTimeout(move,6000)
}
setTimeout(move,3000)
})
这是我仿照京东页面写的轮播图。请问JS那个部分$('.listli').eq(0).addClass('white')。if内部的执行代码。请问为什么执行了$('.listli').eq(0).addClass('white')这句之后。并不会被后面的$('.listli').eq(val).addClass('white')这句的效果给覆盖掉。这是为什么啊、按照从上到下的执行顺序应该会覆盖才对。

		

			
BIG阳

			
浏览 419回答 2

		

	
	

									
	

	

		
2回答

		

			
			

				
				
翻翻过去那场雪

				
if(val==3){$('.listli').eq(0).addClass('white');//如果这里执行，那就是第一个li被加了样式}elseif(val>3){val=1;}$('.listli').eq(val).addClass('white');//在执行这里就是第四个li被加上了样式然而你只有三个li

				

					

            
            
          

          
0

				

			

			
			

				
				
繁星coding

				
你明明是给不同的li给class，为什么会被覆盖呢。应该在$('.listli').eq(val).addClass('white')之前清除上一个li的class

				

					

            
            
          

          
0

				

			

			
		

	

	

		随时随地看视频慕课网APP
	

	
	
	

		
相关分类

		

			
			

			
				 JavaScript
			
			

				
			
		

	

	
	
	

		我要回答