當使用「this」時，函數會丟失上下文 - Raphael JS

Question

我正在循環一個對象並在Raphael中創建圈子。在我創建的每個圈子上，我附加了一個單擊事件和一個mouseover事件。但是，當我使用「this」將圓移動到前面，例如this.toFront（）時，則我的.click函數不起作用。如果我對this.toFront（）發表評論，那麼我的點擊功能按預期工作。

你能幫我理解我做錯了什麼嗎？

//dummy variables for example 
var x_coord = '31'; 
var y_coord = '50'; 
var diameter = '80'; 
var opportunityUrl = 'http://www.google.com'; 
var fillColorStart = '#000'; 
var fillColorEnd = '#FF0000'; 

var p = paper.circle(x_coord, y_coord, diameter) 
.data("i", i) 
.click(function() { 
    alert(opportunityUrl); 
}) 
.mouseover(function() { 
    this.toFront(); 
}) 
.attr({"fill": "90-"+fillColorStart+":5-"+fillColorEnd+":95","fill-opacity": 0.5}) 
.glow({color: "#4b4b4b", width: 7}) 

Answer 1

雖然我不知道拉斐爾是如何工作的全部，我覺得this在這種情況下指的是window對象。這將打破事件鏈，這可能會破壞對象上的所有事件，這會導致您的.click()無法正常工作。

Answer 2

我已經回答了類似問題here。基本上，匿名函數中的指針this並不是指您認爲它的作用。

就你而言，做上面說的Elliot可能是最簡單的解決方案。