Question

已解决 ：仍然没有动画，不必要的页面刷新很难，现在我可以继续......

该脚本有效，它实际上删除了mySQL数据库中的记录页面刚刚刷新，而不是褪色动画...... 我使用的是jquery-2.2.0.min.js

的jquery / AJAX：

<script type="text/javascript">
$(function () {
    $(".delete").click(function(){
        var element = $(this);
        var sht_id = element.attr("id");
        var info = 'id=' + sht_id;
        if (confirm("Are you sure you want to delete?")) {
            $.ajax({
                url: 'delsht.php',
                type: 'post',
                data: info,
                succes: function() {

                }
            });
            $(this).parent().parent().fadeout(300, function(){
                $(this).remove();
            });
        }
        return false;
    });
});
</script>

HTML：

            <table>
                <tr><td style="vertical-align: top;"><div id="shoutdate">
                    <div id="time"><?=$date;?><br><?=$time?></div>
                </div></td>
                <td style="vertical-align: top;"><div id="shoutby">
                    <div id="poster"><a href="?l=profile&id=<?=$poster;?>" id="<?=$rank;?>"><?=$poby;?></a></div>
                </div></td>
                <td style="vertical-align: top;"><div id="shoutcon">
                    <?=$message?>
                    <? /* if ($ctrl == 1){ */?>
                        <div id="admin">
                            <div id="ban"></div>
                            <a href="" id="<?=$sht_id;?>" class="delete"><div id="del"></div></a>
                        </div>
                    <?/* } */?>
                </div></td></tr>
            </table>

Answer 1

您需要使用success功能（拼写正确）。另外$(this)必须更改，否则会调用$(this)成功。

<script type="text/javascript">
$(function () {
    $(".delete").click(function(){
        var element = $(this);
        var sht_id = element.attr("id");
        var info = 'id=' + sht_id;
        $this = $(this);
        if (confirm("Are you sure you want to delete?")) {
            $.ajax({
                url: 'delsht.php',
                type: 'post',
                data: info,
                success: function() {
                   $this.parents(".item").fadeout(300, function(){
                      $this.remove();
                   });
                }
            });

        }
        return false;
    });
});
</script>

update:

给你的表一类item并更改父部分

Answer 2

您正在点击＆＃39; a＆＃39;元素，所以你需要阻止默认事件

$(function () {
    $(".delete").click(function(event){
        event.preventDefault();
        var _ = $(this);
        var sht_id = _.attr("id");
        var info = 'id=' + sht_id;
        if (confirm("Are you sure you want to delete?")) {
            $.ajax({
                url: 'delsht.php',
                type: 'post',
                data: info,
                succes: function() {
                    _.closest('tr').remove();
                }
            });

        }
        return false;
    });

Answer 3

您不需要将“删除”按钮括在“a href”标记中，因为jquery将处理单击的div。

<a href="" id="<?=$sht_id;?>" class="delete"><div id="del"></div></a>

阅读

<div id="<?=$sht_id;?>" class="delete"><div id="del"></div></div>

我认为

<a href=""

是导致页面重新加载的原因

jquery / ajax删除功能保持刷新而不是动画

3 个答案: