2017-10-07 20 views
1

ここで私のコードです。今では、その機能ブロックに1行のコードを含めるだけでなく、どうしたらいいのでしょうかと言う人もいます。これにjavascriptの「クリック」イベントでネストされた関数呼び出し

me.el.addEventListener("click", me.click, false);//.... 

me.el.addEventListener("click", me.click.bind(me), false);//.... 

だけme.clickを渡すときは、あなただけですどのように私は、ボタンのイベント

var i = 0; 
function el() { 
    this.type = "button", 
    this.el = false, 
    this.click = function() { 
     this.setHtml(i++); 
    }, 
    this.setHtml = function (t) { 
     this.el.innerHTML = t; 
    } 
    fragment = document.createDocumentFragment(), 
     element = fragment.appendChild(document.createElement(this.type)); 
    element.setAttribute("data-el", this.type); 
    element.innerHTML = "Default Button"; 
    this.el = element; 
    attachEvent("click", this); 
} 
// this should be a seperate function .... 
function attachEvent(ev, me){ 
//me doesn't work, but i want it to call the click method 
    me.el.addEventListener("click", me.click, false);//.... 

} 


div = new el(); 
document.getElementById('areaA').appendChild(div.el); 

答えて

1

変更この "クリック" にthis.clickメソッドを呼び出すことができますclick関数への参照とmeへのバインディングが渡されます。 .bind()は、イベントハンドラが呼び出されたときに右のthis値を与える自己バインディングスタブ関数を作成します。

+1

+1問題は関数のコンテキストであり、バインドでは "this"コンテキストを選択できます。ここでは、バインドに関するリンクがあります。https://developer.mozilla.org/en-US/docs/Web/ JavaScript/Reference/Global_Objects/Function/bind – Kalamarico

+0

これはとてもクールです、ありがとう –

関連する問題