2011-01-27 49 views
0

嘗試使用svg onClick來調用原型函數。Javascript原型函數和SVG setAttribute(onclick)

通常要調用原型函數我只是這樣做(functionName),但是當我將它放入.setAttribute(onclick, "this.(functionName)")時,它不能識別原型函數。有沒有人有過這方面的經驗?

如果上述還不清楚繼承人它的基本JIST ...

function myobject(svgShape) { 
    this.svgshape.setAttribute(onclick, 'this.doSomething()'); 
} 
myobject.prototype.doSomething = function() { 
    alert("works"); 
} 
+0

歡迎的StackOverflow!在提問時右邊有一個標題爲「如何格式化**」的框。值得一讀,就像問題區域上方的** [?] **那樣[鏈接頁面](http://stackoverflow.com/editing-help)。它告訴你如何正確地格式化你的代碼,諸如此類的事情。 (我已經爲你解決了這個問題。)由於你是新手:如果你還沒有,強烈推薦閱讀[FAQ](http:// stackoverflow。因爲StackOverflow與您可能習慣的各種討論組,郵件列表等不一樣。 – 2011-01-27 09:55:14

回答

3

三件事情可以幫助:

1)首先,我想你錯過了這從myobject功能的頂線:

this.svgshape = svgshape; 

我假設只是張貼了相關的錯誤,並已插入下方。

2)通常當您使用Prototype(或任何現代庫)時,您不使用字符串進行回調,您可以使用函數。另外,您通常使用庫的包裝器爲addEventListener/attachEvent(原型的情況下爲observe)分配處理程序,而不是舊的DOM0屬性。所以:

function myobject(svgShape) { 
    this.svgshape = svgshape; 
    $(this.svgshape).observe('click', this.doSomething); // STILL WRONG, see below 
} 
myobject.prototype.doSomething = function() { 
    alert("works"); 
} 

3)但是JavaScript沒有方法(它並不真正需要它們),它只是有功能,因此上述不保證this(該上下文該呼叫)設置正確。與原型你會使用bind設置上下文:

function myobject(svgShape) { 
    this.svgshape = svgshape; 
    $(this.svgshape).observe('click', this.doSomething.bind(this)); 
} 
myobject.prototype.doSomething = function() { 
    alert("works"); 
} 

(或者你可以使用自己的關閉做的bind的優點是閉包是在一個非常良好的控制環境等沒有按不要關閉你不想保留的東西。)

現在,我從來沒有用Prototype做任何SVG編程,所以如果observe由於某種原因不起作用,你可以嘗試直接分配給onclick反射屬性:

function myobject(svgShape) { 
    this.svgshape = svgshape; 
    this.svgshape.onclick = this.doSomething.bind(this); 
} 
myobject.prototype.doSomething = function() { 
    alert("works"); 
} 

我仍在使用bind,因此this具有正確的值。

從我的貧血小博客這些職位提供更多的討論上面的: