发新贴  快速回复

【腾讯&远程课堂作业】百度评分作业

曼联兔子
2017-11-14 17:19

老师好,我这个mouseover和mouseout可以写出来,不过写到onclick的话就一直出错,里面的控制思路理不清,请帮我理理思路

附件下载:
 
 
j_love

思路是这样的:

1. 定义两个变量

var isClick = false;  // 记录是否点击了星星,无论哪一个都记录是点击

var clickIndex = -1;  // 记录点击的是哪一个星星,记录下标

 

2. 再点击任意一个星星时候,就记录点击了和点击的下标

stars[i].onclick = function(){

isClick = true;   // 记录已经点击

clickIndex = this.index; // 记录点击的下标

}

3. 在离开的时候,有两种情况,点击了和每点击,则需要使用isClick来判断

stars[i].onmouseout = function(){

// 离开的时候 判断是否点击,如果点击了

// 则判断如果小于点击的下标,就添加上样式

 

if(isClick){

//当每次循环先去除所有的样式

for(var j = 0, len =stars.length;j <len;j++){

stars[j].classList.remove('bg2');

}

//给 >= stars[i].index = i的元素添加样式

for(var k =0;k<clickIndex+1;k++){

stars[k].classList.add('bg2');

}

}else{

 

// 如果没有点击就去掉所有的星星的样式

for(var j = 0, len =stars.length;j <len;j++){

stars[j].classList.remove('bg2');

}

}

 

}

 

具体可以看附件

 

附件下载:
 
2017-11-14 21:20  回复本帖
登录 后才可以发表回复