作者sk1765 (鼎玉鉉)
看板Ajax
標題Re: [問題] removeEventListener 失敗?
時間Tue Jan 4 00:40:09 2011
※ 引述《klern (灰)》之銘言：
: 大家好 目前遇到一點瓶頸 囧
: 我寫一小段要偵測在行動裝置上手勢的事件
: 但是最後的removeEventListener 似乎沒成功
: 我在remove的那個function中 加了一段 alert 發現警告視窗數目會遞增
: 例如第一次彈一個視窗 第二次就彈兩個
: 想請問我是哪裡寫錯了嗎 謝謝
: P.S. 裝置為iPad , $.shove式一個plugin傳入目前的this
: document.getElementById(“divID”).addEventListener(‘gesturestart’,
: $.shove(this.onGestureStart, this), false);
: onGestureStart: function(e) {
: e.preventDefault();
: document.getElementById("divID").addEventListener('gesturechange',
: $.shove(this.onGestureChange, this), true);
: document.getElementById("divID").addEventListener('gestureend',
: $.shove(this.onGestureEnd, this), true);
: return false;
: },
: onGestureChange: function(e) {
: e.preventDefault();
: …
: return false;
: },
: onGestureEnd: function(e) {
: e.preventDefault();
: alert('1');
: document.getElementById("divID").removeEventListener('gestureend',
: $.shove(this.onGestureEnd, this), true);
: document.getElementById("divID").removeEventListener('gesturechange',
: $.shove(this.onGestureChange, this), true);
: document.getElementById("divID").removeEventListener('gesturestart',
: $.shove(this.onGestureStart, this), false);
: return false;
: }
我大概搞懂你的問題出在哪了 就是那個$.shove
addEventListener('gestureend',$.shove(this.onGestureEnd, this), true)
之所以可以繫結上event 是因為 $.shove(this.onGestureEnd, this)
回傳一個匿名function
function() { return this.onGestureend.apply(this,e); } ->A
這個匿名function 繫結到了 gestureend事件
所以即使gestureend事件 不是直接執行 this.onGestureend 他仍然被跑到了
現在再來看
removeEventListener('gestureend',$.shove(this.onGestureEnd, this), true)
他也繫結到了匿名function
function() { return this.onGestureend.apply(this,e); } ->B
但是這個匿名function 跟addEventListener的那個 完全是兩個匿名function
因為用$.shove產生了兩次 A和B是不同的
所以只要想辦法刪到同一個匿名function就行了
以下是我的解法 多設幾個變數就行了
document.getElementById(“divID”).addEventListener(‘gesturestart’,
a1 = $.shove(this.onGestureStart, this), false);
onGestureStart: function(e) {
e.preventDefault();
document.getElementById("divID").addEventListener('gesturechange',
a2 = $.shove(this.onGestureChange, this), true);
document.getElementById("divID").addEventListener('gestureend',
a3 = $.shove(this.onGestureEnd, this), true);
return false;
},
onGestureChange: function(e) {
e.preventDefault();
…
return false;
},
onGestureEnd: function(e) {
e.preventDefault();
alert('1');
document.getElementById("divID").removeEventListener('gestureend',
a3, true);
document.getElementById("divID").removeEventListener('gesturechange',
a2, true);
document.getElementById("divID").removeEventListener('gesturestart',
a1, false);
return false;
}
以上請參考 若不能用在研究
--
※ 發信站: 批踢踢實業坊(ptt.cc)
◆ From: 211.74.226.117
1F：→ klern:謝謝 似乎不太行... 我確認一下有沒有打錯的地方 01/04 09:40
2F：→ sk1765:如果不行的話 把變數都單獨寫看看 都寫在外面 01/04 10:24
3F：→ sk1765:a3 = $.shove(this.onGestureEnd, this) 還有a2,a1都寫在 01/04 10:25
4F：→ sk1765:程式最上面 addEventListener 和 removeEventListener裡面 01/04 10:28
5F：→ sk1765:只放變數 a1,a2,a3 再試看看 01/04 10:29
6F：→ sk1765:喔 這樣也不行 變成this繫結不到 變數必須寫成實字裡面 01/04 10:31
7F：推 klern:哈 謝謝 剛試了 目前看是可以 剛剛在回文XD 01/04 10:36