jquery解释django+ajax+json的数据

一、后台的视图的实现代码：

# ajax模糊查询接口
def ajax_data(request):
    if request.method == 'GET':
        # 获取模糊搜索关键词
        keyword = request.GET['keyword']
        if keyword:
            json_data = serializers.serialize("json", Wine.objects.filter(Q(cn_name__icontains=keyword)))
        else:
            json_data = serializers.serialize("json", Wine.objects.all())
        print json_data
        # 如果存在关键字
        return HttpResponse(json_data, content_type="application/json")
    else:
        return render_to_response("test.html")

二、模板实现代码：

        $(function () {
            {# 监听输入框的输入事件 #}
            $('#wine-name').keyup(function(){
{#              alert("输入框输入内容!");#}
                {# 获取输入框内容 #}
                var keyword = $(this).val();
                {# 发送AJAX请求到后台进行模糊查询，并把结果返回 #}
                $.get("{% url 'ajax' %}", {'keyword': keyword}, function(data){
                    {# 后台返回的是json数组 #}
                    alert(data[0].fields.cn_name);
                });
           });
        });

三、注意点：

    因为在后台使用django的序列化json的类，这个类序列化json是有一定的格式的，如下：

[{"fields": {"en_name": "faguoluwaerhedulinjiuzhuangpinlizhu", "uuid": "93349C44-D8BA-495E-A687-44AE3FAEA9A5", "country": "\u6cd5\u56fd", "num": 2, "cn_name": "\u6cd5\u56fd\u5362\u74e6\u5c14\u6cb3\u675c\u6797\u9152\u5e84\u54c1\u4e3d\u73e02009\u5e72\u7ea2\u8461\u8404\u9152", "type": "\u5e72\u7ea2"},

"model": "app.wine",

"pk": 2}]

    简单来说就是添加了一些键值，model是数据来源的model，pk是主键。在模板中解释json的时候，要先取得fields域，再取里面的值即可。比如：data[0].fields.uuid就是结果中的第一个元素中的uuid值。