クリックイベントが1つのテーブル行で機能していますか？

Question

は、私は私の最初の行は、クラスedit1、第1 edit2などを有するであろう、そのクラスeditと定義された変数番号で識別されるのjQueryのテーブルの単一の行を選択するとの問題があります。

私の懸念は、テーブルの最後の行でクリックイベントを発生させることができ、私は明らかに理由を知ることができますが、実際にそれらの行を動的に選択する方法に関する情報は見つかりません。

私はこのような.each方法を試みた：

$('table tr').each(function(){ 
     $('.edit{{server->id}}').on('click', function(){ 
       $(this).attr("contenteditable", "true"); 
       $(this).addClass('form-group'); 
       $('div.editable').addClass('form-control'); 
       $('div.hidbtn').removeAttr('hidden'); 
     }); 
}); 

をそして、ここに私の{{server->id}}だけの行を作成するforeachから取られた最後の{{server->id}}を参照しているため、それは明らかに働いていません。

どのようにすれば、すべての単一の行を選択し、その1つ1つのクリックイベントを発生させることができますか？

スクリプト内のforeach？

私は道でLaravel 5.4を使用しています。..

これは、このような愚かな質問をもたらす可能性があればすみません。

ありがとうございます！

Answer 1

各trでテーブルを調べ、すべての行の内側にある.edit要素にイベントをバインドする必要がある場合は、その要素を「見つける」だけでイベントをバインドできます。

$('table tr').each(function(){ 
    $(this).find('.edit').on('click', function() { 
     ... 
    }); 
}); 

Answer 2

この

var id=1; 
$('table tr').each(function(){ 
    $('.edit'+id).on('click', function(){ 
     $(this).attr("contenteditable", "true"); 
     $(this).addClass('form-group'); 
     $('div.editable').addClass('form-control'); 
     $('div.hidbtn').removeAttr('hidden'); 
    }); 
    id+=1; 
}); 

さもないと、この
HTMLのように行うようにしてみてください： - jqueryの

<td onclick="clickFunctio()"></td> 

： -

function clickFunctio() { 
     $(this).attr("contenteditable", "true"); 
     $(this).addClass('form-group'); 
     $('div.editable').addClass('form-control'); 
     $('div.hidbtn').removeAttr('hidden'); 
    }