addEventListener重复绑定的问题 1C

写了一段代码
var checkbox={
checkAllBox:'checkAllBox',
uncheck:'uncheck',
data_checked:'data-checked',
checkbox_css:'checkbox-css',
checked:'checked',
cancelCheck:'cancelCheck',
select_one:function () {
const checkAllBox=this.checkAllBox;
const uncheck=this.uncheck;
const checkbox_css=this.checkbox_css;
const checked=this.checked;
const cancelCheck=this.cancelCheck;
var checkOneBox_css=document.querySelectorAll('.'+checkbox_css);
for(var i=0;i<checkOneBox_css.length;i++){
(function (i){
if(checkOneBox_css[i].className.indexOf(uncheck)===-1){
checkOneBox_css[i].addEventListener('click',function (event) {
console.log(event.target);
event.stopPropagation();
var event_name=event.target.className;
if(event.target===this&&event.target.className.indexOf(checkAllBox)===-1){
if(event_name.indexOf(checked)!==-1){
event.target.className=event_name.replace(checked,cancelCheck);
}else{
if(event_name===checkbox_css){
event.target.className +=' '+checked;
}else{
event.target.className=event_name.replace(cancelCheck,checked);
}
}
}
},false);
}
})(i);
}
},
checkbox:function () {
this.select_one();
}
};
每次调用checkbox.checkbox(); 会重复绑定addEventListener,该怎么办。。。

5个回答

直接用onclick方法替换addEventListener

qq_40733954
.Unreal 感激不尽
7 个月之前 回复
qq_40733954
.Unreal 真的可以哦
7 个月之前 回复

绑定前先删除先前绑定的事件,详见http://blog.csdn.net/chaoyang89111/article/details/78131250

a229513407
a229513407 我知道重复绑定可以先解绑,如果是jQuery很简单,或者函数写在外面也是,可是你们看下我的函数写法,再说下这个构造函数怎么解绑啊
接近 3 年之前 回复

同上,先解除绑定,再绑定。

jiangxinyu50
小楼窗外的细雨 checkOneBox_css.removeEventListener('click',function (event) {},false); 或者试下在 }, checkbox:function () { this.select_one(); }之前加
接近 3 年之前 回复
jiangxinyu50
小楼窗外的细雨 回复a229513407: 加在这个下面试下var checkOneBox_css=document.querySelectorAll('.'+checkbox_css);
接近 3 年之前 回复
a229513407
a229513407 我知道重复绑定可以先解绑,如果是jQuery很简单,或者函数写在外面也是,可是你们看下我的函数写法,再说下这个构造函数怎么解绑啊
接近 3 年之前 回复

我知道重复绑定可以先解绑,如果是jQuery很简单,或者函数写在外面也是,可是你们看下我的函数写法,再说下这个构造函数怎么解绑啊

var checkbox={
checkAllBox:'checkAllBox',
uncheck:'uncheck',
data_checked:'data-checked',
checkbox_css:'checkbox-css',
checked:'checked',
cancelCheck:'cancelCheck',

select_one:function () {
    const checkAllBox=this.checkAllBox;
    const uncheck=this.uncheck;
    const checkbox_css=this.checkbox_css;
    const checked=this.checked;
    const cancelCheck=this.cancelCheck;

    var checkOneBox_css=document.querySelectorAll('.'+checkbox_css);

    for(var i=0;i<checkOneBox_css.length;i++){
        (function (i){
            if(checkOneBox_css[i].className.indexOf(uncheck)===-1){

                checkOneBox_css[i].addEventListener('click',function (event) {  console.log(event.target);

                    event.stopPropagation();
                    var event_name=event.target.className;

                    if(event.target===this&&event.target.className.indexOf(checkAllBox)===-1){

                        if(event_name.indexOf(checked)!==-1){
                            event.target.className=event_name.replace(checked,cancelCheck);
                        }else{
                            if(event_name===checkbox_css){
                                event.target.className +=' '+checked;
                            }else{
                                event.target.className=event_name.replace(cancelCheck,checked);
                            }
                        }
                    }
                },false);
            }
        })(i);
    }
    checkOneBox_css.removeEventListener('click',function (event) {},false);    //  插入在这边试试看
},
checkbox:function () {
    this.select_one();
}

};


a229513407
a229513407 不用试了 我之前这么写过了,function走的就不是一个,解绑不了
接近 3 年之前 回复
Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!
立即提问