Question

当我在获取输入值时尝试访问ajax外部的object属性时，它返回正确的值。但是当我尝试在成功函数中记录并附加该值时，它返回undefined。我该如何解决这类问题？似乎对象是本地的，不能被ajax访问？以下是我的代码。

$('#add-order').on('click',function(){

    //create an object for orders
    var order = {   

        name : $('#name').val(),
        drink : $('#drink').val()
    };

    $.ajax({
        url : 'api/orders.json',
        type : 'POST',
        data : order,
        dataType : 'json',
        success : function(newOrder){
            console.log(newOrder.name);
            $('#orders').append('<li>' + newOrder.name + ' : ' + newOrder.drink + '</li>');
        },
        error: function(){
            console.log('error connecting');
        }
    });

});

这是index.html

<h4>Add a Coffee Order</h4>
<ul id="orders">

</ul>

<p><input type="text" id="name"></p>

<p><input type="text" id="drink"></p>

<button type="submit" id="add-order">Add</button>

因为我需要服务器端语言，所以我使用PHP。但是我无法使用JSON.stringify方法编写来自ajax的数据。

    <?php

   if (isset($_POST['submit'])) {
        $orders = $_POST['data'];
        $orderFile = fopen('api/orders.json', 'w');

       fwrite($orderFile, $orders);
       fclose($orderFile);
   }

我也在顶部更新了我的代码。当我将任何字符串硬编码为fwrite（$ orderFile，“我的订单”）时，它将写入orders.json但是当我使用$ orders时它不起作用。我在这里错过了什么吗？

Answer 1

newOrder是AJAX调用返回的JSON，它可以有不同的密钥，具体取决于你在做什么，如果要打印order对象，那么

$('#orders').append('<li>' + order.name + ' : ' + order.drink + '</li>');

Answer 2

但是当我尝试记录并在成功函数中附加该值时，它返回undefined。

这是因为您的json文件orders.json或服务器端代码的逻辑。在成功回调中返回的json newOrder中，对象将没有键name/drink，因此导致undefined。

所以，你必须使用指定的密钥从服务器端返回它，它应该如下所示：

{ "name":"Mango", "drink":"shake" }

使用Ajax Jquery打印Object属性时的未定义结果

2 个答案: