如何获取json值并以html格式显示

时间:2011-03-01 23:00:42

标签: json facebook api jquery yql

我一直在为此而自杀。我希望使用cause API从我们活动的一些原因中获取一些数据并通过html显示。

我创建了一个Facebook应用程序,我正在尝试使用jquery ajax。这就是我所拥有的:

<script type="text/javascript">
$(document).ready(function()
{
  $.ajax({
    url: "http://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20xml%20where%20url%3D'http%3A%2F%2Fapi.causes.com%2Fbeneficiaries%2F1239.xml'&format=json&callback=cbfunc",
    dataType: "json",
    success: function(cbfunc) {
        $(cbfunc).find('count').each(function(){
            var total = $(this).find('total-raised').text();
            $(this).html('<p>'+total+'</p>').appendTo('#listTotalDollor');
        });
    }
  });
});

问题是我没有显示任何内容。这是一个跨域问题还是我错过了什么。

谢谢!

更新的代码:

<script type="text/javascript">
$(document).ready(function()
{
  $.ajax({
    url: "http://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20json%20where%20url%3D%22http%3A%2F%2Fapi.causes.com%2Fbeneficiaries%2F1239.json%22&format=json",
    dataType: "json",
    success: function(data) {
        $.each(data.query.results, function(i, key) {
            var total = key['total_raised'];
            $("#listTotalDollar").html('<span>' + total + '</span>');
        });
    }
  });
});

最后一个问题:

如果我想将其中一个返回值格式化为货币。

在我更新的代码中,我得到了5000的回报,我希望它能读到5,000美元。你可以指点一下吗?

1 个答案:

答案 0 :(得分:2)

您正在混合使用DOM和JSON访问cbfunc。假设您希望该查询返回的每个元素都有total-raised个数字,您可以简单地请求JSON(就像您一样)并相应地迭代它。

    $.ajax({
        // !wrapped only for readability!
        url: "http://query.yahooapis.com/v1/public/yql?
                  q=select%20*%20from%20xml%20where%20url%3D'\
                  http%3A%2F%2Fapi.causes.com%2Fbeneficiaries%2F1239.xml'\
                  &format=json",

        dataType: "json",
        success: function(data) {
            // `data` is actually a json structure (as requested)
            // if you want to see it as a whole, just use 
            // console.log(data);

            // now iterate over the json structure 
            // (see also: http://stackoverflow.com/q/1078118/89391)
            // and set your target dom element as you like 
            // (this is just a dummy ...)
            $.each(data.query.results, function(i, key) {
                var total = key['total-raised'].content;
                $("target").html('<p>' + total + '</p>');
            });
        }
    });

以下是我用于调试的代码:https://gist.github.com/850148。 作为参考,这里是响应的草图:

Object
    query: Object
        count: 1
        created: "2011-03-01T23:24:18Z"
        lang: "en-US"
        results: Object
            beneficiary: Object
                id: Object
                name: "INTERNATIONAL FELLOWSHIP OF CHRISTIANS & JEWS"
                recent-facebook-donors: "time1297716630facebook_id0nameRobert \
            Alan Schoonoveramount200time1297372019facebook_id0nameCurtis En…"
                total-causes: Object
                total-donors: Object
                total-members: Object
                total-raised: Object
            __proto__: Object
        __proto__: Object
    __proto__: Object
__proto__: Object