亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

為什么面向對象中addEventListener找不到屬性或者無法移除事件?

為什么面向對象中addEventListener找不到屬性或者無法移除事件?

九州編程 2019-04-21 20:41:04
以下兩短代碼都表示一個簡單功能,描述為:我想要的效果是,鼠標按下后,在頁面移動不斷計數,鼠標抬起則移除事件。但是下面的代碼都有問題。第一段代碼的問題,找不到removeEventListener屬性:functioncounter(obj){this.obj=obj;this.num=0;}counter.prototype.start=function(){varself=this;self.obj.addEventListener("mousemove",self.move,false);self.obj.addEventListener("mouseup",self.end,false);}counter.prototype.move=function(){varself=this;document.title=self.num++;}counter.prototype.end=function(){varself=this;self.obj.removeEventListener("mousemove",self.move,false);self.obj.removeEventListener("mouseup",self.end,false);}counter.prototype.init=function(){varself=this;self.obj.addEventListener("mousedown",self.start,false);}varcounterNew=newcounter(document);counterNew.init();以上代碼在init中有修改,原來是self.end,搞錯了,應該是self.start第二段代碼的問題,可能是因為綁定和刪除都是匿名函數,所以無法移除事件:functioncounter(obj){this.obj=obj;this.num=0;}counter.prototype.start=function(){varself=this;self.obj.addEventListener("mousemove",function(){self.move();},false);self.obj.addEventListener("mouseup",function(){self.end();},false);}counter.prototype.move=function(){varself=this;document.title=self.num++;}counter.prototype.end=function(){varself=this;self.obj.removeEventListener("mousemove",function(){self.move();},false);self.obj.removeEventListener("mouseup",function(){self.end();},false);}counter.prototype.init=function(){varself=this;self.obj.addEventListener("mousedown",function(){self.start();},false);}varcounterNew=newcounter(document);counterNew.init();請問大家,有解決方案嗎?多謝了
查看完整描述

2 回答

?
夢里花落0921

TA貢獻1772條經驗 獲得超6個贊

非面向對象實現
//非面向對象實現
varnum1=0;
functionstart(){
num1++;
document.title=num1;
}
document.addEventListener("mousedown",function(){
this.addEventListener("mousemove",start,false);
},false);
document.addEventListener("mouseup",function(){
this.removeEventListener("mousemove",start,false);
});
面向對象實現
functionCounter(obj){
this.num=0;
this.obj=obj;
}
Counter.prototype.countNum=function(){
that.num++;
this.title=that.num;
}
Counter.prototype.mdStart=function(){
this.addEventListener("mousemove",that.countNum,false);
}
Counter.prototype.mdEnd=function(){
this.removeEventListener("mousemove",that.countNum,false);
}
Counter.prototype.start=function(){
that=this;
this.obj.addEventListener("mousedown",that.mdStart,false);
this.obj.addEventListener("mouseup",that.mdEnd,false);
}
Counter.prototype.end=function(){
this.addEventListener("mouseup",this.mdEnd,false);
}
Counter.prototype.init=function(){
this.start();
}
varcounterNew=newCounter(document);
counterNew.init();
第二種也可以通過call或者apply實現,TZ可以試試
                            
查看完整回答
反對 回復 2019-04-21
?
陪伴而非守候

TA貢獻1757條經驗 獲得超8個贊

第一段代碼解決方案:
counter.prototype.init=function(){
varself=this;
self.obj.addEventListener("mousedown",function(){
self.end();
},false);
}
原因:self.obj.addEventListener("mousedown",self.end,false);,self.end函數中的this指向了document。
                            
查看完整回答
反對 回復 2019-04-21
  • 2 回答
  • 0 關注
  • 494 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號