1

我是一个尝试.ajax通过在线教程学习 jquery 的 n00b。

我的本地主机上的“客户端”有以下代码:

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title></title>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.js"></script> 
    <script> 
        // wait for the DOM to be loaded 
        $(document).ready(function() { 
            $("#submit_btn").click(function(){
                $.ajax({
                      type: "POST",
                      url: "response.php",
                      dataType: 'json',
                      data: { name: "John", location: "Boston" }
                }).done(function( msg ) 
                {
                  alert( "Data Saved: " + msg );
                });
            });
        }); 
    </script> 
</head>
<body>
    <input type="submit" name="submit" class="button" id="submit_btn" value="Send" /> 
</body>
</html>

我在名为“response.php”的“服务器”端文件中有以下代码:

<?php
if (isset($_POST))
{
$answer = $_POST;
echo json_encode($answer);
}  else {
echo json_encode("no good");
}
?>

当我单击“发送”按钮时,我会收到一条提示“已保存数据:[对象对象]”的警报。我试图让警报显示使用点击事件通过“发布”提交的数据。我希望警报显示“姓名:“约翰”,位置:“波士顿”。

4

1 回答 1

2

"Data Saved: " + msg.name + " " + msg.location

您收到的是JSON对象,因此在javascriptprints中打印一个对象[object Object]。您应该使用.(点)运算符访问对象的属性以获取名称和位置。

假设,您的响应是以下 JSON 对象:

msg = { name : "John", last_name : "Doe" }

要访问对象name的属性,请msg使用点运算符:

console.log(msg.name);

为了使您的代码通用,您应该能够以某种方式告诉客户端请求是好是坏。所以你可以status像这样发回:

<?php
if (isset($_POST))
{
$answer = $_POST;
$answer['status'] = true;
echo json_encode($answer);
}  else {
echo json_encode(array('status' => false, 'msg' => 'no good'));
}
?>

在客户端上,您必须检查status

function(response) {
  if (response.status) {
    console.log('yep, post was submitted, name is ' + response.name + ', location is ' + response.location);
  }
  else {
    console.log('something went wrong: ' + response.msg);
  }
}

更新

还有一件事:一旦你决定使用JSON,就不要text/plain寄回。这正是您在这里所做的:

echo json_encode("no good");

此代码 a 生成的字符串"no good"text/plain,但不是有效JSON对象。

Take a look at what JSON is

于 2013-04-22T03:33:31.910 回答