使用 jQuery 删除 AJAX 记录答案

【问题标题】：AJAX Record Deletion Using jQuery [closed]使用 jQuery 删除 AJAX 记录
【发布时间】：2013-08-26 16:25:48
【问题描述】：

您好，我刚刚找到了一个使用 ajax 从我的数据库中删除一行的代码，但问题是当在 html 中进行删除时，应该消失的表不起作用。

这里是js代码

 <script type="text/javascript"  />
  $(document).ready(function() {
$('a.delete').click(function(e) {
    e.preventDefault();
    var parent = $(this).parent();
    $.ajax({
        type: 'get',
        url: 'index.php',
        data: 'ajax=1&delete=' + parent.attr('id').replace('record-',''),
        beforeSend: function() {
            parent.animate({'backgroundColor':'#fb6c6c'},300);
        },
        success: function() {
            parent.slideUp(300,function() {
                parent.remove();
            });
        }
    });
});

});

PHP 代码就是这个

<? echo "<div class=\"record\" id=\"record-".$id."\" >  
<tr >
    <td><span style='color:#eb8500' >".++$i."</span></td>
    <td width='270px' style='padding:5px'><div align='left' >
     ".$name."
    </div></td>

    <td width='50px' style='padding:5px'><div align='left' >

     <input  onclick='this.select()' type='text' size='15' value='".$link."' />
    </div>
    </td>
    <td style='padding:5px'><div align='center'>
     ".$cat."
    </div>
    </td>
    <td >

    <a  class=\"delete\" href=\"?delete=".$id."\" >Delete</a>
    </td>
    </tr>
</div >"; ?>

它应该删除所有显示在 echo 中的表，但它没有。感谢您的帮助...

【问题讨论】：

你的问题是它没有从 DOM 中删除 HTML（但它成功地从数据库中删除了记录），反之亦然？
如果是这样，您可能想尝试var parent = $(this).parent().parent();
谢谢你工作得很好。但现在我如何在发送之前使用这个函数：function() { parent.animate({'backgroundColor':'#fb6c6c'},300); }，成功：function() { parent.slideUp(300,function() { parent.remove(); 更改 tr 后它现在不起作用。感谢您的时间
最简单的修复方法是创建两个不同的父级，即 var parent = $(this).parent(); 和 var grandparent = $(this).parent().parent(); 并相应地使用它们。

标签： php javascript jquery mysql ajax

【解决方案1】：

不确定我是否理解您的问题，但如果您在 AJAX 成功完成后尝试删除 <tr>，那么您需要确保 var parent 指的是 <tr>，如下所示：

var parent = $(this).parents('tr');

see jquery traversing

现在，它将直接父元素指向<a>，即<td>。

【讨论】：

好的，非常感谢，现在它可以工作了，tr 消失了，但请最后一件事。此功能现在不起作用，更改为 var parent = $(this).parents('tr'); 后如何使其现在起作用？？？感谢 beforeSend: function() { parent.animate({'backgroundColor':'#fb6c6c'},300); }, 成功：function() { parent.slideUp(300,function() { parent.remove();
什么不起作用？滑动效果？ bg动画？两者都有？
bg 动画不起作用，幻灯片起作用。
啊，那是因为您无法在 tr 上设置动画/样式。试试parent.children('td').animate({...})