javascript - 动态创建的 <td> 上的单击事件

Question

我有下表，它是在开始时使用 onload 函数动态创建的。

<div id="first">
<table class="joma" id="joma">
<tbody>
<tr>
   <th>Id</th>
   <th>V No</th>
   <th>Biboron</th>
   <th>Taka</th>
</tr>
<tr><td class="rid">1</td><td>sss</td><td>222</td><td class="cv">4</td></tr>
<tr><td class="rid">2</td><td>xxx</td><td>2333</td><td class="cv">4</td></tr>
</tbody>
</table>
</div>

现在我需要能够单击 <td class="rid">这应该给出相应的值。在本例中为 1 或 2。

我该怎么做？

我使用了以下方法:

$(document).ready(function() {
    $('.rid').click(function() {
        alert(this);
    });
});



$('.rid').click(function() {
    alert(this);
});

我没有得到任何东西。

Answer 1

使用.on()

$(document).on('click','.rid',function() {
     alert("this");
});

当页面加载时创建 DOM .rid 不是页面的一部分。

因此您无法直接访问它们，您必须使用事件委托(delegate)