javascript 为元素绑定不同点击事件

Leezy__ 发布于 2015/06/07 08:17
阅读 899
收藏 0
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的每一项绑定了两个点击事件

效果就是点击每一项右边栏会划出,再点击一下会滑回去。
可是代码敲完之后发现点击第一项的时候会划出,再点击第一项的时候没反应,这时候点击第二项时会滑回去。
求高手指点迷津!!
加载中
0
假装在纽约
假装在纽约

一种方法:绑定一个点击事件就 ok,定义一个变量(var stat = 0;)记录点击状态,缺省值0(或 false),第一次点击后为1(或 true),通过判断这个状态你你再做动作。

另一种方法(与第一种大同小异):就是将上面的记录状态的值放在 html 表中的属性当中,比如

<button stat="0">隐藏|显示</button>



点击一次修改 stat 的值一次,就是0和1来回切。

就是 jquery 中的 toggle 之类的方法。


0
范老司
范老司

  你首先确定一点是你写完这段代码后测试第一项是没有任何问题,也就是说解释器在解释你的js代码后,你的第一项功能是没有问题的,此时,无论你试多少次你的第一个图标都是没有问题的,只要你不单击其他项目,如果你单击了其他项会出现你说的问题

  解决办法

      你在切换到其他项时对原来的项进行还原或初始化操作

Leezy__
Leezy__
我是新手,很多都不太会,请问我该怎样初始化其他的项呢?
0
小k宝贝
小k宝贝
为什么不考虑jquery
返回顶部
顶部