动态删除待办事项：基于PHP、MySQL与Ajax的无刷新实现教程

<script type="text/javascript">
    $(document).ready(function() {
        // 监听所有具有 'delete-btn' 类的按钮的点击事件
        $('#todo-list').on('click', '.delete-btn', function() {
            var id = $(this).data("id"); // 从data-id属性获取任务ID

            // 弹出确认对话框，提升用户体验
            if (confirm("您确定要删除此任务吗？")) {
                $.ajax({
                    type: "POST", // 使用POST方法发送数据
                    url: "task_delete.php", // 后端处理删除请求的PHP脚本
                    data: { id: id }, // 将任务ID作为数据发送
                    cache: false, // 禁用缓存
                    success: function(response) {
                        // 请求成功后，根据后端返回的响应（如果需要）或直接移除前端元素
                        // 这里我们假设后端成功删除后不会返回特定内容，直接移除前端元素
                        // 使用fadeOut动画平滑地隐藏并移除任务项
                        $(".delete_task_" + id).fadeOut('slow', function() {
                            $(this).remove(); // 动画完成后从DOM中彻底移除
                        });
                    },
                    error: function(xhr, status, error) {
                        // 处理请求失败的情况
                        alert("删除失败，请稍后再试。错误信息：" + error);
                        console.error("Ajax error:", status, error);
                    }
                });
            } else {
                return false; // 用户取消删除
            }
        });
    });
</script>

<?php
// task_delete.php

// 引入数据库连接文件
// 确保您的database.php文件包含正确的数据库连接代码
// 示例：$database = new PDO('mysql:host=localhost;dbname=your_db', 'username', 'password');
include('database.php'); 

// 检查请求方法是否为POST，并获取任务ID
if ($_SERVER['REQUEST_METHOD'] === 'POST' && isset($_POST['id'])) {
    $id = $_POST['id'];

    // 验证ID是否为数字，防止非预期输入
    if (!is_numeric($id)) {
        http_response_code(400); // Bad Request
        echo "无效的任务ID。";
        exit();
    }

    try {
        // 构建SQL删除语句
        // **重要：使用预处理语句防止SQL注入攻击**
        $stmt = $database->prepare("DELETE FROM tasks WHERE task_id = :id");
        $stmt->bindParam(':id', $id, PDO::PARAM_INT); // 绑定参数，确保类型安全

        // 执行SQL语句
        if ($stmt->execute()) {
            http_response_code(200); // OK
            echo "任务删除成功。";
        } else {
            http_response_code(500); // Internal Server Error
            echo "任务删除失败。";
            // 可以在这里记录详细的错误日志
        }
    } catch (PDOException $e) {
        http_response_code(500); // Internal Server Error
        echo "数据库操作错误：" . $e->getMessage();
        // 记录异常信息
    }
} else {
    http_response_code(400); // Bad Request
    echo "无效的请求。";
}
?>