有关js为元素绑定两个点击事件的问题

Question

var sideRight = document.getElementById('sideright'); var side = document.getElementsByClassName('side-icon'); var flag = true; for (var i = 0; i < side.length; i++) { (function() { if (flag) { side[i].addEventListener('click', function() { changeManyElem(sideRight, { 'right': 0 }, 30); }, false); flag = false; } else { side[i].addEventListener('click', function() { changeManyElem(sideRight, { 'right': -350 }, 30); flag = true; }, false); } })(); }这里我side的每一项绑定了两个点击事件效果就是点击每一项右边栏会划出，再点击一下会滑回去。可是代码敲完之后发现点击第一项的时候会划出，再点击第一项的时候没反应，这时候点击第二项时会滑回去。求高手指点迷津！！

Answer 1

想实现你所说的方法，你可以这样:

for (var i = 0; i < side.length; i++) {
    side[i].addEventListener('click', function() {
           if(flag){  
              changeManyElem(sideRight, {'right': 0}, 30);  
           }
           else{  
              changeManyElem(sideRight, {'right': -350}, 30);
           }
     }, false);
}

Answer 2

你写的那个判断语句，if~else，在一次循环里，if~else只可能执行其中一项，意味着第一次循环if就给第一个side添加划出事件，第二次循环else就给第二个side添加一个划回事件。