2 回答

TA貢獻1911條經驗 獲得超7個贊
你的問題涉及到變量作用域的問題。 我們來各個擊破。
首先看這段代碼:
var aPage = function(){ var test = document.getElementById("test"); var obj = new obj(); test.innerHTML = "<a href='#' onclick='obj.hello();'>hello</a>";}
你的目的是想 new 一個 obj 對象的實例。 由于變量的聲明會被提前到函數執行前。你這段代碼實際上是
var aPage = function(){ var obj, test; test = document.getElementById("test"); obj = new obj(); test.innerHTML = "<a href='#' onclick='obj.hello();'>hello</a>"; }
當你嘗試 new 的時候,obj 實際上是 undefined
。當你嘗試對 undefined
進行 new 操作的時候,會出錯。這個是第一個錯誤。
假設你修復了第一個錯誤,aPage 函數里面的 obj 是你想要的那個對象的實例之后,我們繼續看。
test.innerHTML = "<a href='#' onclick='obj.hello();'>hello</a>";
這段代碼會把一段 html 文本塞到 DOM tree 里面。onclick 這種調用方式屬于 0級 DOM 事件。這種事件句柄中,查找變量的作用域鏈是從本節點至其父節點一直延伸到 window。而你的 aPage 函數并不在該作用域鏈上。但同時,你的 window 下有一個變量 obj,此時會查找到該變量。
此時,onclick 后的 obj 對象是 window 下的 obj,而非你在 aPage 函數中 new 的對象。
但是 window 下的 obj 在實例化之前是不包含 hello 方法的。所以你調用 obj.hello()
的時候會報錯。這個是第二個錯誤。
為了解決這個問題,推薦使用 2級 DOM 事件。
例如
var OBJ = function(){ this.hello = function(){ alert("hello"); } }var aPage = function() { var test = document.getElementById('test'); var obj = new OBJ(); test.addEventListener('click', function() {obj.hello()}); }
此時當點擊時,事件函數可以在作用域鏈中找到正確的 obj 對象并執行。

TA貢獻1842條經驗 獲得超21個贊
js和dom還沒有融合到這么緊密的程度,二者是兩個完全分離的環境。
可以這樣:
test.innerHTML = "<a href='#' >hello</a>"; $("a",test).click(function(){ obj.hello(); });
也可以通過dom屬性來互相傳遞值,具體問題具體對待。
添加回答
舉報