ajax判断商品删除(ajax删除后刷新页面：示例代码)

当我们使用Ajax进行商品删除操作时，我们需要在删除商品的通过Ajax发送请求给服务器，告知服务器删除的是哪个商品。在服务器成功删除商品后，我们可以通过Ajax的回调函数来刷新页面，以展示删除后的最新商品列表。

我们需要在前端页面中添加一个删除按钮，用于触发删除操作。当用户点击删除按钮时，我们需要获取该商品的唯一标识，以便告知服务器删除的是哪个商品。我们可以通过给删除按钮添加一个自定义属性来存储商品的唯一标识，例如data-id。示例代码如下：

<button class="a0f3-909a-34d3-4b47 delete-btn" data-id="1">删除商品</button>

接下来，我们可以使用JavaScript来监听删除按钮的点击事件，并通过Ajax发送请求给服务器。在发送请求之前，我们需要获取商品的唯一标识，以及服务器处理删除请求的URL。示例代码如下：

document.querySelector('.delete-btn').addEventListener('click', function() {
  var productId = this.getAttribute('data-id');
  var url = '/delete-product';
  var xhr = new XMLHttpRequest();
  xhr.open('POST', url, true);
  xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
  xhr.onreadystatechange = function() {
    if (xhr.readyState === 4 && xhr.status === 200) {
      // 删除成功后的回调函数
      location.reload(); // 刷新页面
    }
  };
  xhr.send('productId=' + productId);
});

在上述代码中，我们使用XMLHttpRequest对象来发送POST请求。我们需要使用open方法设置请求的方法、URL以及是否异步。然后，我们需要使用setRequestHeader方法设置请求头，告知服务器请求的数据类型。接着，我们监听xhr对象的onreadystatechange事件，当请求状态为4且响应状态为200时，表示服务器成功处理了删除请求。在回调函数中，我们使用location.reload()方法来刷新页面，以展示删除后的最新商品列表。

我们需要在服务器端编写相应的代码来处理删除请求，并返回相应的响应结果。根据具体的后端语言和框架，代码的实现方式会有所不同。例如，在Node.js中，可以使用Express框架来处理删除请求的路由。示例代码如下：

app.post('/delete-product', function(req, res) {
  var productId = req.body.productId;
  // 在数据库中删除商品
  // ...
  res.sendStatus(200);
});

在上述代码中，我们使用Express框架的post方法来定义一个路由，当接收到/delete-product的POST请求时，执行回调函数。在回调函数中，我们可以通过req.body对象获取发送请求时携带的数据，例如productId。然后，我们可以在数据库中执行删除商品的操作。我们使用res.sendStatus方法返回200状态码，表示删除成功。

通过以上步骤，我们可以实现通过Ajax判断商品删除，并在删除成功后刷新页面的功能。