起因剖析:
i会不停的笼罩,只会记录循环最初一次的i的赋值,导致永远无奈实现i为奇数时的款式扭转。
解决方案:
计划一:将for循环改为forEach循环,但forEach循环针对数组应用,若是节点列表或者对象即不实用。
计划二:将点击事件放到函数用,在for 循环中仅调用函数实现屡次的调用。 函数每次调用会调用一个独立的i。
计划三:将for循环中的var换成let。
var checkboxs = document.querySelectorAll("input[name=check]");
for (var i = 0;i < checkboxs.length;i++){
function f (i);
}
function f (i){
checkboxs[i].onclick = function(){
var line = this.parentElement.parentElement;
// this 在点击事件中代表的checkboxs[i]
if(this.checked == true){
line.style.backgroundColor = 'darkblue';
}else{
if(i % 2 == 0){
line.style.backgroundColor = 'lightcyan';
}else{
line.style.backgroundColor = 'lightblue';
}
}
}
}
发表回复