如何删除表格行?

时间:2013-05-21 13:39:35

标签: jquery ajax

我尝试让以下代码在过去的5-6小时内完成,但没有运气。

任何人都可以帮我理解这段代码有什么问题吗?点击删除链接后没有任何反应。

这是我的表:

<table id="links">
    <tr id="record-<?php echo $row['FeePaymentId']; ?>">
        <td><?php echo $row['MasterEntryValue']; ?></td>
        <td><?php echo $row['Amount']; ?></td>
        <td><a href="#" class="delete">delete</a></td>
    </tr>
</table>

这是我的JavaScript:

$('table#links td a.delete').click(function() {
    if (confirm("Are you sure you want to delete this row?")) {
        var id = $(this).parent().parent().attr('id');
        var data = 'id=' + id ;
        var parent = $(this).parent().parent();

        $.ajax({
            type: "POST",
            url: "DeleteRow.php",
            data: data,
            cache: false,
            success: function() {
                parent.fadeOut('slow', function() {$(this).remove();});
            }
        });                
    }
})

2 个答案:

答案 0 :(得分:0)

如果页面中没有其他JS错误并且click事件根本没有触发,那么你的JS没有任何问题。而不仅仅是将你的JS代码放在$(document).ready(function(){});:

$(document).ready(function () {
    $('table#links td a.delete').click(function()
    {
        if (confirm("Are you sure you want to delete this row?"))
        {
            var id = $(this).parent().parent().attr('id');
            var data = 'id=' + id ;
            var parent = $(this).parent().parent();

            $.ajax(
            {
                   type: "POST",
                   url: "DeleteRow.php",
                   data: data,
                   cache: false,

                   success: function()
                   {
                        parent.fadeOut('slow', function() {$(this).remove();});
                   }
             });                
        }
    })
});

答案 1 :(得分:0)

选择器不正确,请尝试以下操作:$('#links a.delete')将在ID为“链接”的元素下选择所有类别为“delete”的锚元素

jsfiddle