2011-06-11 50 views
6

我使用Raphael.mouseover()和.mouseout()事件來突出顯示SVG中的一些元素。 這工作正常,但我點擊一個元素後,我希望它停止突出顯示。Raphael JS:如何刪除事件?

Raphael documentation我發現:

解除綁定事件與「非」前綴使用同樣的方法名稱,即element.unclick(F);

但我不能得到這個工作,我也不明白'f'參數。

這不起作用,但是什麼?

obj.click(function() { 
    this.unmouseover(); 
}); 
+0

隨着40個問題,我希望他們中的57%以上有可能被標記爲正確適當的答案。 :) – 2011-06-11 10:55:05

+2

不,文檔說你可以使用'un'來解除這些事件......但它不起作用,或者我做錯了什麼......我會再次檢查我的問題以選擇好的答案,但他們中的大多數人還沒有完全回答,我想...... – Dylan 2011-06-11 10:59:21

+0

如果你有一堆問題有答案,但沒有一個是「正確的」,那麼你可能會重新考慮你是如何提出問題的,不管他們是清晰和簡潔,以及它們是否過於本土化,無法成功回答。 :) – 2011-06-11 11:02:56

回答

5

好吧,你所要做的就是通過處理函數的unmouseover要求:

// Creates canvas 320 × 200 at 10, 50 
var paper = Raphael(10, 50, 320, 200); 
// Creates circle at x = 50, y = 40, with radius 10 
var circle = paper.circle(50, 40, 10); 
// Sets the fill attribute of the circle to red (#f00) 
circle.attr("fill", "#f00"); 
// Sets the stroke attribute of the circle to white 
circle.attr("stroke", "#fff"); 

var mouseover = function (event) { 
    this.attr({fill: "yellow"}); 
} 
var mouseout = function (event) { 
    this.attr({fill: "red"}); 
} 

circle.hover(mouseover, mouseout); 
circle.click(function (event) { 
    this.attr({fill: "blue"}); 
    this.unmouseover(mouseover); 
    this.unmouseout(mouseout); 
}); 

http://jsfiddle.net/GexHj/1/

這就是f左右。您還可以使用unhover()

circle.click(function (event) { 
    this.attr({fill: "blue"}); 
    this.unhover(mouseover, mouseout); 
}); 

http://jsfiddle.net/GexHj/2/

+0

太好了,非常感謝!即使現在使用一組對象,我在那裏使用鼠標事件作爲每個對象的'屬性'... – Dylan 2011-06-11 12:27:27

+0

對這個舊答案的問題:調用「this.unmouseout(mouseout);」似乎依賴於你最初綁定的功能名稱是「mouseout」,對吧?所以我可以調用函數「myFunc」,並將其與「unmyFunc」解除綁定,對吧?但是對於任何代碼縮小來說這似乎都很糟糕,不是嗎?如果「myFunc」最小化爲「xy」,那麼「unmyFunc」將最小化爲「unxy」,這完全不能保證。我錯過了什麼嗎? – 2012-07-25 13:10:12

+0

'mouseout'實際上是對函數的引用,而不是字符串值。在理論上,由於通過引用傳遞函數是JavaScript中正常行爲的一部分,所以主動縮小應該識別並替換函數引用以及函數標識符標籤的聲明。我的答案沒有任何測試,你不應該有一個問題。如果您發現特定測試儀的特定測試,請告訴我。 – 2012-07-25 14:46:30