Question

我正在使用AJAX来返回我的对象。我做了一个console.log(obj)，我的对象看起来很完美。这是它在我的控制台日志中的样子：

[{"first_name":"jeremiah", "last_name":"test"}, {"first_name":"jay", "last_name":"grens"}]

但是，当我将每个first_name和每个last_name附加到特定div时，我无法使其正常工作。这就是我的Ajax的样子：

$('#search_contact').keyup(function() {
var keys = $(this).val();
$.ajax({
    type: 'post',
    url: 'contacts/search',
    data: {'keys':keys},
    success: function(res) {
        console.log(res);
        $('#contacts tbody').html('');
        $.each(res, function(i, val) {
            $('#contacts tbody').append('<tr><td>'+first_name+'</td><td>'+last_name+'</td></tr>');
        });
    }
});
});

当我这样做时，我的#contacts tbody为空，我在控制台日志中收到此错误：

Uncaught TypeError: Cannot use 'in' operator to search for '926' in (my full obj...)

Answer 1

$.ajax({
    type: 'post',
    url: 'contacts/search',
    data: {'keys':keys},
    dataType: 'json',
    success: function(res) {
        console.log(res);
        $('#contacts tbody').html('');
        $.each(res, function(i, val) {
            $('#contacts tbody').append('<tr><td>'+val.first_name+'</td><td>'+val.last_name+'</td></tr>');
        });
    }
});

Answer 2

要使用first_name获取$.each，您需要使用0索引，例如

$(this)[0]['first_name']

或您传递给回调函数的val参数，如

val['first_name']

在代码段

中查看两种方式

var test = [{"first_name":"jeremiah", "last_name":"test"}, {"first_name":"jay", "last_name":"grens"}];

$.each(test, function(i, val){
       $('body').append('<div>'
                        +$(this)[0]['first_name']+'</div><div>'
                        +val['last_name']+'</div>');
       });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

<强>更新

与其他人提到的一样，您需要使用$.parseJSON来避免异常

Uncaught TypeError: Cannot use 'in' operator to search...

或者您可以将dataType: 'json'设置为自动解析对JSON

的回复

Answer 3

最后我找到了它，感谢你们让我指出正确的方法。

$('#search_contact').keyup(function() {
var keys = $(this).val();
$.ajax({
    type: 'post',
    url: 'contacts/search',
    data: {'keys':keys},
    success: function(res) {
        console.log(res);
        $('#contacts tbody').html('');
        var res = $.parseJSON(res);
        $.each(res, function(key, val) {
            console.log(val['first_name']);
        });
    }
});
});

正如您所看到的，我在$ .each之前添加了一个新行，将来自php脚本的字符串转换为json数组。

如何使用AJAX在JQuery中追加对象的值

3 个答案: