问题:
一下代码中: div 多次绑定 click 事件 ,绑定一次 , 点一下 触发一次 , 绑定2次 , 点一下,触发两次 。 有没有办法减少 div.addEventListener 绑定的 click 事件的次数?? 我尝试过的:
// 无论事件是否存在 , 先移除
div.removeEventListener
// 无时间是否存在 , 添加
div.addEventListener
这样做 , 没有效果(绑定2次, 仍然触发两次 , 三次触发三次) .... 有没有办法做到:
div.onclick = function(){ ... }
类似与这样的效果(就是不产生事件队列) , 而是不断的重写事件(类似于 js的函数重载)
描述的不是太清楚 , 请耐心看完,谢谢
html :
<div class='loginEvent'>绑定</div>
<div class='div'>这是一个测试按钮</div>
var div = document.getElementsByClassName('div')[0];
var bindBtn = document.getElementsByClassName('loginEvent')[0];
// 通过此按钮 可以 让 对元素 div 绑定多次click事件
bindBtn.addEventListener('click' , loginEvent ,false);
// 注册 div 事件
function loginEvent(){
div.addEventListener('click' , sayHello ,false);
}
// div 事件触发内容
function sayHello(){
console.log('hello');
}
绑定事件前先移除一次呢?如
bindBtn.removeEventListener('click' , loginEvent ,false);
另外就是自己实现一个绑定解绑的工具函数,通过工具函数来绑定解绑事件。
这样你就可以控制绑定次数了
removeEventListener 应该是没有问题的,很有可能是 removeEventListener 写法不对,能把你这部分在问题里详细补充一下吗,你的问题里只是说明了一下 APi,没有看到传入的参数。
你还不如换个思路,初始化先绑定一个函数就别动了,随后改动这个函数。
var loginEvent = function() {};
bindBtn.addEventListener('click' , loginEvent);
后面随时修改这个loginEvent
loginEvent = function() { alert('1'); };
loginEvent = function() { alert('2'); };
loginEvent = function() { alert('3'); };