首頁猿問為什么面向?qū)ο笾衋ddEventL...

為什么面向?qū)ο笾衋ddEventListener找不到屬性或者無法移除事件？

JavaScript

九州編程 2019-04-21 20:41:04

以下兩短代碼都表示一個簡單功能，描述為：我想要的效果是，鼠標(biāo)按下后，在頁面移動不斷計數(shù)，鼠標(biāo)抬起則移除事件。但是下面的代碼都有問題。第一段代碼的問題，找不到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，搞錯了，應(yīng)該是self.start第二段代碼的問題，可能是因為綁定和刪除都是匿名函數(shù)，所以無法移除事件：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貢獻(xiàn)1772條經(jīng)驗獲得超6個贊

非面向?qū)ο髮崿F(xiàn)//非面向?qū)ο髮崿F(xiàn)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);});面向?qū)ο髮崿F(xiàn)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實現(xiàn)，TZ可以試試

反對回復(fù) 2019-04-21

陪伴而非守候

TA貢獻(xiàn)1757條經(jīng)驗獲得超8個贊

第一段代碼解決方案：counter.prototype.init=function(){varself=this;self.obj.addEventListener("mousedown",function(){self.end();},false);}原因：self.obj.addEventListener("mousedown",self.end,false);，self.end函數(shù)中的this指向了document。