2

下面的代码不起作用。试图搜索天气位置。当我搜索时，什么也没有发生。

<input type="text" id="query" /><button>search</button><br />
<div id="results">

</div>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){
var url='http://autocomplete.wunderground.com/aq?format=JSON&query=';
var query;
    $('button').click(function(){
        query=$("#query").val();
        $.getJSON(url+query,function(json){
            $.each(json.results,function(i,location){
               $("#results").append('<p>'+location.name+'</p>');
            });
        });
    });
});
</script>

仅供参考，我对编码非常缺乏经验（从另一个网站复制脚本）

4

2 回答 2

4

如果要进行跨域请求，则必须使用JSONP，并且应该为 JSONP 请求附加回调函数，如wunderground.com 中所述，试试这个。

$(document).ready(function() {
    var url = 'http://autocomplete.wunderground.com/aq?format=JSON&query=';
    var query;
    $('button').click(function() {
        query = $("#query").val();
        $.getJSON(url + query + '&cb=callbackfunc', function(json) {
            $.each(json.results, function(i, location) {
                $("#results").append('<p>' + location.name + '</p>');
            });
        });
    });
});​

更新：

首先你应该了解什么是JSONP。

cb 参数用于wunderground API 中的 JSONP 回调函数，如您在文档中所见。

如果你还是不明白为什么需要使用 jsonp 回调函数，

打开这两个链接，您将看到它们之间的区别。

无 cb 参数

带 cb 参数

于 2012-05-09T15:26:24.210 回答
0

出于安全原因，您不能使用 JavaScript 从远程站点提取数据（请参阅同源策略）。

解决方法包括 CORS（有限的浏览器支持，该服务不支持）、JSON-P（该服务显然不支持）以及在您自己的服务器上使用代理。

于 2012-05-09T15:29:19.543 回答