0

!!!Andrew Whitaker 的回答(很好的例子)已经回答了以下问题。基本上,您可以使用 $.getJSON(..) 以编程方式从 YQL 等服务获取 JSON 数据,注意该服务可以与不同的域相关联(即,不是由加载页面的同一域提供) . 通常,您不能向不同的域发出这样的请求,因此在实现请求时使用“技巧”来动态生成 HTML 并将其插入 DOM 并获取并执行新的跨域脚本。在执行返回的脚本时,它会导致处理它携带的 JSON 并调用您提供的回调函数。因为这种技术会盲目地执行返回的脚本,所以必须注意安全问题(可能类似于加载任何脚本)。为了启用跨域功能,在提供的 getJSON url 中包含选项“?callback =?”非常重要,该选项被 jQuery 拾取并删除/修改,作为使用 JSONP 跨域调用的信号技术。请注意,这种返回 JSON 数据的方法依赖于 JSONP 的服务器端支持。再次感谢所有帮助。!!!

以下代码发送到 YQL 并获取 IBM 的当前股票价格(作为示例)。它工作正常,并通过加载一个脚本文件来完成其任务,该脚本文件的 URL 有效地导致 JSON 数据的动态生成,在加载和执行时,会导致运行“top_stories”并提取价格。但是,我想基于 AJAX 调用 ($.getJSON(..)) 进行此过程,我假设我从下面基于脚本的示例中分离出 url 和数据组件。我已经尝试了很多变体但没有成功——我似乎无法通过 $.getJSON(..) 调用来调用回调函数。任何想法将不胜感激。...埃里克

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
  <head><title>YQL</title>
   <style type='text/css'>
    #results{ width: 40%; margin-left: 30%; border: 1px solid gray; padding: 5px; height: 200px; overflow: auto; } 
  </style>
  <script type='text/javascript'>
  // Parses returned response 
  function top_stories(o) {
      var price = o.query.results.xml_api_reply.finance.last.data;
      alert("last = " + price);
      // Place price in div tag
      document.getElementById('results').innerHTML = price;
  }
</script>
</head>
<body>
   <!-- Div tag for stories results -->
   <div id='results'></div>
   <!-- The YQL statment will be assigned to src. -->
   <script src="http://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20google.igoogle.stock%20where%20stock%3D'ibm'%3B&format=json&diagnostics=true&env=store%3A%2F%2Fdatatables.org%2Falltableswithkeys&callback=top_stories"></script>   
 </body>
</html>
4

2 回答 2

0

我不确定这是否是您的意思,但是您可以通过以下方式将查询字符串参数分解为“数据”对象:

$.getJSON("http://query.yahooapis.com/v1/public/yql?callback=?", {
    q: "select * from google.igoogle.stock where stock='ibm'",
    format: 'json',
    diagnostics: true,
    env: 'store://datatables.org/alltableswithkeys'
}, top_stories);

示例:http: //jsfiddle.net/dcXjk/1/

顺便说一句,如果您仍然使用 jQuery,您可以继续使用.html直接分配给innerHTML

function top_stories(o) {
    var price = o.query.results.xml_api_reply.finance.last.data;
    alert("last = " + price);
    // Place price in div tag
    $("#results").html(price);
}

这是一个更充实的示例,您也可以在其中传递股票代码:

JavaScript:

function top_stories(o, symbol) {
    var price = o.query.results.xml_api_reply.finance.last.data;

    // Place price in div tag
    $("#" + symbol).html(price);
}

function getStockValue(symbol) {
    $.getJSON("http://query.yahooapis.com/v1/public/yql?callback=?", {
        q: "select * from google.igoogle.stock where stock='" + symbol + "'",
        format: 'json',
        diagnostics: true,
        env: 'store://datatables.org/alltableswithkeys'
    }, function(data) {
        top_stories(data, symbol);
    });
}


$(function() {
    getStockValue("ibm");
    getStockValue("nflx");
    getStockValue("msft");
});

HTML:

<p>IBM:</p><div id="ibm"></div>
<p>Netflix:</p><div id="nflx"></div>
<p>Microsoft:</p><div id="msft"></div>

示例:http: //jsfiddle.net/B3L4p/1/

于 2012-07-17T00:24:00.550 回答
0

这是一个工作代码:

    $(function () {
    var ticker = "IBM";
    var url = "http://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20yahoo.finance.quotes%20WHERE%20symbol%3D'"+ticker+"'&format=json&diagnostics=true&env=store%3A%2F%2Fdatatables.org%2Falltableswithkeys";
    $.getJSON(url, function(data) {
      var items = [];
      $.each(data.query.results.quote, function(key, val) {
        if(key == "ChangePercentRealtime" || key == "LastTradeRealtimeWithTime") { items.push(val)};
      });
        $("#nameOfDiv1").html(items[0].substr(9));
        $("#nameOfDiv2").html(items[1].substr(6));
    });
});

substr() 从返回的结果中获取实际数据,其中包含一些无用的东西。它把它放在一些html div中。您显然可以选择任何您想要的结果集。希望对你有帮助!

于 2012-07-17T00:20:13.017 回答