Jquery Ajax 无法将数据定向到服务器

Question

我正在尝试修复我的 jquery ajax 脚本，该脚本应该删除一个 sql 行并删除存储在服务器上的两个文件。目前，当用户单击删除按钮时，会弹出 js 确认消息，但在用户确认“是”时，脚本会死掉，没有任何内容被删除，无论是 sql 行还是文件。行标识符是“id”。如何纠正这种情况以删除数据，然后删除包含数据的元素？

html

<div class="record<?php echo $id; ?>">
      <form method="POST" id="delete_form">
        <input type="hidden" id="id" value="<?php echo $id; ?>" name="id" />
        <input type="hidden" id="ad_link" value="<?php echo $ad_link; ?>" name="ad_link" />
        <input type="hidden" id="listing_img" value="<?php echo $listing_img; ?>" name="listing_img" />
        <input type="button" class="delete" name="delete" value="Delete" />
      </form>
</div>

js（紧接在之前）

<script src="../js/jquery.js"></script>
<script type="text/javascript">
$(function() {
    $(document).on('click', '.delete', function() {
        var element = $(this);

        if (confirm("Are you sure you want to delete this listing?")) {
            $.ajax({
                type: "POST",
                url: "delete_list.php",
                data: {id: element.data("id"), ad_link: element.data("ad_link"), listing_img: element.data("listing_img") },
                success: function() {}
            });
        }
        return false;
    });
});

php（在不同的页面，delete_list.php）

<?php
if (isset($_POST['id']) && ($_POST['ad_link']) || ($_POST['listing_img'])) {
$idc = $_POST['id'];
unlink($_POST['ad_link']);
unlink($_POST['listing_img']);

try {
    require('../dbcon2.php');
    $conn = new PDO("mysql:host=$servername;dbname=$dbname", $username, $password);
    $conn->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
    $stmt = $conn->prepare("DELETE FROM listings WHERE id = ?");
    $stmt->execute(array($idc));    
    }
catch (PDOException $e) {
    echo $sql . "<br>" . $e->getMessage();
}
$conn = null;
}
 $url = 'http://website.com/members_area/delete_listings.php';
 while (ob_get_status()) {
  ob_end_clean();
  }
  header("Location: $url");
?>

Answer 1

您的整个脚本 (JS) 是基于以下内容构建的：

$(document).on('click', '.delete', function() {
    var element = $(this);

也就是说，您只访问 .delete 元素的值；而它们存在于父 form 元素中。作为Fred suggested 使用提交按钮；尝试以下方法：

<form method="POST" id="delete_form">
    <input type="hidden" id="id" value="<?= $id; ?>" name="id" />
    <input type="hidden" id="ad_link" value="<?= $ad_link; ?>" name="ad_link" />
    <input type="hidden" id="listing_img" value="<?= $listing_img; ?>" name="listing_img" />
    <button type="submit">Delete</button>
  </form>

和 JS：

$('form').on('submit', function() {
    var element = $(this);

现在；您可以在 AJAX 请求中简单地传递 $(this).serialize()。