jQuery Ajax Post - 如何获取数据返回？

Question

jQuery Ajax Post - 如何获取数据返回？

7

我有一个个人资料页面，其中包含一系列图片。我想使用jQuery允许用户从服务器删除一张图片，并在不重新加载整个页面的情况下更新页面。当成功时，它将从页面中删除图像所在的div容器。我的删除函数是PHP，非常简单：

delete.php

<?php 
if (isset($_POST['id'])) {     
    if (unlink($_POST['id'])) { 
        echo "success";
    } 
    else { 
        echo "failure"; 
    } 
} 
?>

在调用delete.php页面之前，已经设置了用户身份验证。

以下是一个显示的图片的 HTML 代码 - 这里可以有多达5个这样的代码块排列在一起：

<div class="box">
  <img src="uploads/t_10DOT_22C_1111_1300370702_3.jpg" /> 
  <h5><a rel="external" href="uploads/10DOT_22C_1111_1300370702_3.jpg">See full version</a></h5> 
  <a href="#" id="10DOT_22C_1111_1300370702_3.jpg" class="delete" onclick="return ConfirmDelete();" >x</a>
  <div class="clear"></div> 
</div>

我的jQuery代码目前看起来像这样：

$(document).ready(function() {
$('#load').hide();
});

$(function() {
$(".delete").click(function() {
$('#load').fadeIn();
var commentContainer = $(this).parent();
var id = $(this).attr("id");
var string = 'id='+ id ;

$.ajax({
   type: "POST",
   url: "delete.php",
   data: string,
   cache: false,
   success: function(data){
    commentContainer.slideUp('slow', function() {$(this).remove();});
    $('#load').fadeOut();
  }

 });

return false;
    });
});

我关心的部分是ajax提交。成功部分实际上是如何工作的？我的php文件需要做什么，以便ajax知道删除是成功还是失败？

我关注的是ajax的post请求部分。成功的处理机制是怎样的？我需要在我的php文件中做什么来让ajax知道删除操作是否成功？

- EmmyS

不要忘记实际验证提供的帖子ID。否则我可能会发送'id=delete.php'并删除您的文件！ - Alnitak

3个回答

1

我能想到两个明显的选项：

你返回的文本应该出现在传递给你的success回调函数的data参数中 - 但是你可能还需要确保它以与你的PHP返回的MIME Content-Type兼容的格式，否则jQuery可能会抱怨无法解析它，或者：
如果删除操作失败，请使用header()函数从你的PHP发送一个5xx Failure类型的消息。这应该会触发一个AJAX error回调，你需要提供这个回调。

- Alnitak

但是我的返回文本如何出现在提供给success的数据参数中呢？我看到的所有内容都说data实际上是您传递到post函数中的参数，而不是您收到的返回值。 - EmmyS

你的代码中有两个 data - 一个是你在调用 $.ajax 时提供的对象中的键，另一个是成功函数的参数。后者将包含响应文本。为避免混淆，请给它重新命名。 - Alnitak

谢谢。我看到的示例都在两个地方使用“data”，所以我认为它是同一个变量。给它们取不同的名称让我更清楚了解它们之间的区别。 - EmmyS

0

从delete.php返回删除是否成功。在成功的情况下，检查该数据并适当处理。

希望对你有所帮助。

- Raja

不太有帮助；整个问题是如何检查 PHP 返回的数据？ - EmmyS

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Ozmah · Accepted Answer

当一个 ajax post 请求执行完发送请求的文件后，如果没有错误，你在“success”部分添加的代码将会被执行，在本例中

success: function(data){
  /*The code you need*/
});

前面的部分是代码执行的地方，"data"变量包含你从php文件中返回的所有内容，它可以是数据，也可以是简单的"true"或"false"，你可以选择发送什么来让你的jQuery知道它是否成功。

希望这能有所帮助。

编辑说明：

function(applyData){
  if ( applyData.toString() == 'invalid' ){
    $('#pollError').html('Global styles cannot be modified.');
    $('#pollNotice').html('');
  }
  else{
    $('#pollNotice').html('The changes to the style have been applied.');
  }
});

前面的例子展示了在“成功”事件中函数可以做什么。在那里，我处理了一个“无效”的状态，否则就是成功的，之后我刷新了一些无效的DIV或者在成功的情况下更新了一个单独的DIV。

以下是执行的PHP代码:

if ( !$db->isGlobal($id_css)){
  $data['id_poll'] = $id_poll;
  $data['id_css'] = $id_css;
  $data['css'] = $css;
  $db->applyCssChanges($data);
}
else{
  echo 'invalid';
}