Raphael - 如何處理點擊空白區域？

Question

我有一些元素像圈子&我的畫布上用raphaeljs創建的路徑。當用戶點擊畫布的空白區域時，我只想處理點擊。

我嘗試在拉布爾的canvas/svg elemnt上設置點擊事件，但是每當我點擊空白區域時它的火都會點燃。

例子：http://jsfiddle.net/vpGyL/1389/

var r = Raphael('testGraph', 500, 500); 
r.circle(200,200,100).attr({"fill":"#0F0"}); 
r.path("M100,100L200, 200").attr({ 
    stroke: "#F00", 
    fill: "none", 
    "stroke-width": 3 
}); 
r.canvas.onclick = function(){alert("filled & empty area clicked togethere")}; 

Answer 1

另一個類似羅德里戈的解決方案是隻是爲了檢查活動對象，並檢查其類型，或者ID或任何...

r.canvas.onclick = function(ev){ 
    if(ev.target.localName == 'svg') { 
     alert('svg'); 
    }; 
}; 

Answer 2

我建議你實現它被設置true被點擊元素時的標誌。它看起來是這樣的：

var elementClickFunction = function() {elementClicked = true;}; 
circle.click(elementClickFunction); 

在畫布上點擊功能您檢查elementClicked標誌是否是真還是假，並重新設置。

r.canvas.onclick = function(){ 
    if(elementClicked) { 
     alert('element clicked!'); 
     elementClicked = false; 
    } 
    else { 
     alert('whitespace clicked!'); 
    } 
}; 

在這裏，在行動的例子： http://jsfiddle.net/vpGyL/1392/