クリックした要素を保存して別のオブジェクトからアクセスする

Question

私がしたいのは、特定のDOM要素のセットに対してクリックイベントを設定することです。

クリックした要素を覚えておきたいので、後で情報を取得する必要があるかもしれません。

可能であれば、別のJSオブジェクトからアクセスできるようにしたいと考えています。以下は

は

<ul> 
    <li>Item 1</li> 
    <li>Item 2</li> 
    <li>Item 3</li> 
</ul> 
<button> 
     Which have you clicked on? 
</button> 

<script> 
var listItem = { 
    elementHandle: $('li'), 
    instanceClicked: '', 
    bindEventHandlers: function(){ 
     $(this.elementHandle).click(this.alertTheContent); 
    }, 
    alertTheContent: function(){ 
     this.instanceClicked = $(this); 
     alert(this.instanceClicked.html()); 
    } 
} 

var button = { 
    elementHandle: $('button'), 
    bindEventHandlers: function(){ 
     $(this.elementHandle).click(this.showListItemClicked); 
    }, 
    showListItemClicked: function(){ 
     console.log(listItem.instanceClicked); 
    } 
} 

listItem.bindEventHandlers(); 
button.bindEventHandlers(); 
</script> 

私は近いだけどshowClickedItem（）関数のコンソールログは「」を返していると思う...私はこれまで持っているものです。最初にlistItemオブジェクトを作成したときと同じです。

見つけてくださいここでフィドルthisがliないlistItem

alertTheContent: function(){ 
    listItem.instanceClicked = $(this); 
    alert(listItem.instanceClicked.html()); 
} 

DEMOすなわちクリックハンドラを起動し、現在の要素のコンテキストを指すあなたはalertTheContent機能にlistItem代わりのthisを使用する必要がhttps://jsfiddle.net/rbfaxw12/

Answer 1

Answer 2

の代わりにuse listItem.instanceClicked = $(this);