2016-11-15 3 views
0

私はnode型要素をcardClickedに渡しています。JavaScriptのパラメータとしてノードを渡す?

function init() { 
    for (i in set.cards) { 
     var myP = document.createElement("p"); 
     myP.innerHTML = set.cards[i].points + "&nbsp &nbsp" + set.cards[i].name; 
     myP.addEventListener("click", cardClicked.bind(myP)); 
     document.getElementById("left column").appendChild(myP); 
    } 
} 


function cardClicked(myP) { 
    document.getElementById("right column").appendChild(myP); 
} 

しかし、私はこのコードを実行すると、ブラウザがmyPはNode型ではなく、appendChildを経由して追加することができないと言いますか?

何が起こっているのですか?

+1

私たちが実行するために、あなたは(http://stackoverflow.com/help/mcve)[、最小限の完全な、かつ検証例]を作成していただけますか?私は 'myP'をNodeにしないようなコードは何も表示されません。配列に対して 'for..in'ループを使用しないことを検討するべきです(' set.cards'が配列であると仮定します)。 –

答えて

6

あなたはmyPと呼ばれる2つの変数を持っている:あなたはcardClicked.bind(myP)と呼ばれているので、cardClicked内部thisの値は、それがあったであろう(なり

  1. var myP
  2. cardClicked(myP)

をとにかくイベントハンドラの仕組みのため)。

cardClickedが呼び出されたときに2の値が引き継がれ、それがイベントオブジェクトになります(エラーメッセージに示されているように、ノードではありません)。

代わりにthisを使用してください。


function init() { 
    var i, myP; 
    for (i in set.cards) { 
     myP = document.createElement("p"); 
     myP.innerHTML = set.cards[i].points + "   " + set.cards[i].name; 
     myP.addEventListener("click", cardClicked); 
     document.getElementById("left column").appendChild(myP); 
    } 
} 

function cardClicked(event) { 
    document.getElementById("right column").appendChild(this); 
} 
関連する問題