Попытка поиска местоположений в подземелье с помощью javascript, jquery и html

Question

Код ниже не работает. Попытка поиска погодных мест. Когда я ищу ничего не происходит.

<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>

К вашему сведению, я не очень разбираюсь в кодировании (скопировал скрипт с другого сайта)

Answer 1

Если вы хотите сделать кросс-доменный запрос, вы должны сделать это с 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 предназначен для функции обратного вызова JSONP в wunderground API, как вы можете увидеть здесь в документации.

Если вы все еще не понимаете, почему вам нужно использовать функцию обратного вызова jsonp,

откройте эти две ссылки, и вы увидите, в чем различия между ними.

без cb paramater

с cb paramater

Answer 2

Вы не можете извлекать данные с удаленных сайтов, используя JavaScript из соображений безопасности (см. Ту же политику происхождения).

Обходные пути включают CORS (ограниченная поддержка браузера, не поддерживаемая этой службой), JSON-P (явно не поддерживаемая этой службой) и использование прокси на вашем собственном сервере.