Question

我有一个看起来与此类似的div的表.......

<div id="records">

10 | text1 | Delete
23 | test2 | Delete
24 | text3 | Delete
32 | text4 | Delete

</div>

我想制作“删除”可点击的，它可以调用ajax脚本将其从数据库中删除。

每个'删除'都有一个类“delete_record”

该表由ajax脚本填充，所以为了避免重新绑定问题，我想在“记录”上使用事件冒泡，所以我在div“记录”上添加了一个click事件，在这里我检查“delete_record”，目前只有一个警报，似乎有效..

$('#records').click(function(event)  {
    if ($(event.target).is('.delete_record'))  {
        alert("clicked on CELL");
    }
});

但我真正想要的是访问ajax脚本知道的record_id，并将其传递给ajax脚本以删除记录。我知道如何用正确的值来调用这个ajax脚本，我不知道该怎么做就是弄清楚如何获取这条记录_id

10 | text1 | Delete(20389)
23 | test2 | Delete(37474)
24 | text3 | Delete(2636)
32 | text4 | Delete(83731)

所以当我点击第二行时，脚本会调用....

$.getJSON("/ajax/delete_record.php",{id: 37474, ajax: 'true'}, function(j){ stuff }

Answer 1

你说这个表是从ajax填充的，所以，你可以将你的元数据存储到表中，假设生成了以下html：

<tr>
    <td>23</td>
    <td>test2</td>
    <td><a>Delete</a></td>
    <td class='id'>37474</td> <!-- Hide the id column in css if needed -->
</tr>

所以，只要按照你所做的那样，如果单击'单元'，那么你只需返回它的父元素然后查找td.hasClass（'id'）并获取其中的文本。像：

var parentTR = $(event.target).parent('tr'); // Get the parent row
var id = $("td[class='id']", parentTR).html(); // Retrieve the id content

现在你有了id，你可以把它变成服务器来删除它。

还有一件事要补充，我真的不同意桌子上的事件绑定或父div找到删除按钮，这听起来对我来说太间接了。 JQ实际上为活动绑定事件提供了一个很好的方法，试着看Live Function in JQuery。它确实为你的情况做得很好。