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>

参考までに、私はコーディングに非常に不慣れです（別のWebサイトからコピーされたスクリプト）

4

2 に答える 2

4

クロス ドメイン リクエストを作成する場合は、 でそれを行う必要があります。wunderground.com で説明JSONPされているように、JSONP リクエストのコールバック関数を追加する必要があります。これを試してください。

$(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 コールバック関数を使用する必要がある理由がわからない場合は、

これら 2 つのリンクを開くと、両者の違いがわかります。

cb パラメータなし

cb パラメータ付き

于 2012-05-09T15:26:24.210 に答える
0

セキュリティ上の理由から、JavaScript を使用してリモート サイトからデータを取得することはできません (同じオリジン ポリシーを参照してください)。

回避策には、CORS (制限されたブラウザー サポート、そのサービスではサポートされていません)、JSON-P (明らかにそのサービスではサポートされていません)、および独自のサーバーでのプロキシの使用が含まれます。

于 2012-05-09T15:29:19.543 に答える