jqueryの、キーワードから「この」テーブル

Question

内のすべてのtdのに私はこれを持っています。 imgCancelはテーブルの内側にあり、作成しているすべてのテーブルにimgCancelがあります。

私はこのような二行を置き換えるために考えられてきました：

$(document).on("click","#imgCancel",function(){ 
    $(this).closest('table').find('td').click(function(){ 
     editTables("#tbl_zones td",this) 
    }) 
}) 

それはしかし、動作しませんでした、また、私が何を参照する必要がありeditTables（の最初の引数として置く見当がつかない現在のテーブルのすべてのtdに）。

編集： はjknaackのjsfiddleの変更、私はこれで終わった：

$(document).on("click","#imgCancel",function(){ 
    var tblID = $(this).closest('table').attr('id') 
    $("#"+tblID+" td").click(function(){ 
     editTables("#"+tblID+" td",this) 
    }) 
}) 

Answer 1

問題は、idは、ドキュメント内で一意である代わりに、クラス属性を使用しなければならないということです。

w3c id属性はHTML要素の一意のIDを指定します（id属性の値はHTML文書内で一意でなければなりません）。

• w3c - ID Attribute

Answer 2

ただ、 "これは" 関数呼び出しの要素がクリックされたTDだろう

$(document).on("click","#tbl_zones td", function(){ 
    editTables(this); 
}); 

（仮定は、それはtd要素が含まれている）内部IDを使用します。

Answer 3

私が正しくあなたを得たら、データ属性としてクリック可能な要素の中に新しいセレクターを渡すところがあります。

HTMLがどのように表示されるかを知るのは難しいので、例を作成しました。もちろん、クリックされた要素の内側またはクローゼットでのみセレクタをカスタマイズするようにカスタマイズすることもできます。

JSコード：

$(document).on("click",".actionbuttons",function(){ 
    var selectedElements = $($(this).data("selector")); 
    selectedElements.css("background","#FF0000"); 
    $(selectedElements).click(function(){ 
     $(this).css("background","#00FF00"); 
    }) 
})​ 

HTML例：

<img class="actionbuttons" src="/" data-selector=".test1"/> 
<div class="test1"></div> 
<div class="test1"></div> 
<div class="test1"></div> 
<img class="actionbuttons" src="/" data-selector=".test2"/> 

<div class="test2"></div> 
<div class="test2"></div> 
​ 

http://jsfiddle.net/Ft7SB/