爲什麼事件處理程序不能在javascript中的其他函數上創建的元素上工作

Question

這是我的代碼，請問爲什麼onclick事件不適用於輸入的ini元素。

的JavaScript：

window.onload = function() { 
    var img = document.getElementsByTagName('img'); 
    var div = document.createElement("div"); 
    img[0].onclick = function(event) { 
     document.body.appendChild(div); 
     var sion = document.getElementsByTagName('div'); 
     var val = document.defaultView.getComputedStyle(sion[0], null); 
     var mouseX = event.clientX; 
     var mouseY = event.clientY; 
     document.styleSheets[0].cssRules[0].style.top = (mouseY - 20) + "px"; 
     document.styleSheets[0].cssRules[0].style.left = (mouseX - 20) + "px"; 
     var ini = document.createElement("input"); 
     document.body.appendChild(ini); 
     var hoftag = document.styleSheets[0].cssRules[0].style.height; 
     var result = hoftag.replace("px", ""); 
     result = parseInt(result); 

     document.styleSheets[0].cssRules[1].style.top = (event.clientY - 20 + result) + "px"; 
     document.styleSheets[0].cssRules[1].style.left = (event.clientX - 40) + "px"; 
    }; 
    ini.onclick = function(event) { 
     alert("hi"); 
    }; 
}; 

HTML：

<img src="jlin.jpg" id="image"> 

Answer 1

問題是與變量的作用域。變量ini只能在img[0].onclick = function(event) {內生效。請參閱本偉大的圖片來自「JS忍者」的書：

要修復您的代碼，請嘗試：

img[0].onclick = function(event){ 
    ... 
    var ini = document.createElement("input"); 
    document.body.appendChild(ini); 
    ini.onclick = function(event){ 
     alert("hi"); 
    }; 
    ... 
};