動的に作成されたdivに追加されたイベントは発生しません

Question

私はjavascriptで作業しています。ほとんどの場合、イベントリスナーを追加することができましたが、divには、イベントを追加しても動的に何も生成されませんでした。コードは次のとおりです。

for(var i=0; i<sceneNumber; i++){ 
    var a=i; 
    if(i>2) 
     a=i%3; 
    sceneArray[i]=document.createElement('div'); 
    sceneArray[i].className="border"+a; 
    if(i%2==1) 
     sceneArray[i].style.left=0; 
    else 
     sceneArray[i].style.left=(i+1)*100; 
    sceneArray[i].style.top = i*100+100; 
    sceneArray[i].onclick= function(){console.log("fire212"); 
             if(extend1){ 
              console.log("scenelistener"); 
              currentArrow.rotate(degrees); 
             currentArrow.scale(desiredLength/arrowLength,1); 
             } 
            }; 
console.log(sceneArray[i].onclick); 
    document.getElementsByTagName('body')[0].appendChild(sceneArray[i]); 
    sceneArray[i].style.zIndex = -1; 
    console.log(sceneArray[i]); 
    } 

あなたは、私は、少なくともコンソールで「fire212」を取得する必要がありますが、でもそれは発生しません見ることができるように。何がうまくいかないでしょうか？

Answer 1

JQueryのlive（）メソッドまたはon（）メソッドに対して何かsimilerを実装する必要があります。以下の投稿はあなたを助けるかもしれません。

http://www.alfajango.com/blog/exploring-jquery-live-and-die/

Answer 2

for(var i=0; i<sceneNumber; i++){ 
    var a=i; 
    if(i>2) 
     a=i%3; 
    sceneArray[i]=document.createElement('div'); 
    sceneArray[i].className="border"+a; 
    if(i%2==1) 
     sceneArray[i].style.left=0; 
    else 
     sceneArray[i].style.left=(i+1)*100; 
    sceneArray[i].style.top = i*100+100; 
    sceneArray[i].onclick=onclickevent(); 
console.log(sceneArray[i].onclick); 
    document.getElementsByTagName('body')[0].appendChild(sceneArray[i]); 
    sceneArray[i].style.zIndex = -1; 
    console.log(sceneArray[i]); 
    } 
function onclickevent(){ 
      console.log("fire212"); 
      if(extend1){ 
      console.log("scenelistener"); 
      currentArrow.rotate(degrees); 
      currentArrow.scale(desiredLength/arrowLength,1); 
      } 
     }