очень простой getJSON не работает

Я не нашел правильного ответа, потому что все связанные с ним вопросы использовали внешние ресурсы в примерах.очень простой getJSON не работает

У меня есть очень простой getJSON вызова (в простом файле):

<!DOCTYPE html> 
<head> 
    <script src="//code.jquery.com/jquery-2.1.3.min.js"></script> 
    <script> 
    $(document).ready(function() { 
     var button = $('button'); 
     var weatherList = $('.weather'); 
     button.on('click', function() { 
     $.getJSON('weather.json', function(result) { 
      var elemList = $.map(result, function(city, index) { 
      var listItem = $('<li></li>'); 
      $('<p>' + city.name + '</p>').appendTo(listItem); 
      $('<p>' + city.temp + '</p>').appendTo(listItem); 
      console.log('item') 
      return listItem; 
     }); 
     weatherList.html(elemList); 
     }); 
    }); 
    }); 
</script> 
<title>JqApp</title> 
</head> 
<body> 
    <p id="test">This paragraph is here for testing!</p> 
    <button>fetch</button> 
    <ul class="weather"> 
    </ul> 
</body> 
</html>

JSON:

[ 
    { 
    name: 'Prague', 
    temp: '23' 
    }, 
    { 
    name: 'Hannover', 
    temp: '34' 
    } 
]

Я действительно не могу понять, где может быть проблема. Я тестировал его через серверы Sinatra и Harp. Ничто не помогает. Браузер показывает успешную загрузку JSON, но он не будет отображаться на странице (возможно, JSON Object успешно загружен). Как только я перемещаю weatherList.html(elemList); вниз, за пределами вызова JSON, можно писать на страницу, но, конечно, elemList недоступен за пределами вызова, поэтому он не работает. Интересно, что console.log('item') тоже не работает.

Живой пример здесь: demo

источник

2015-02-17 Honza Hejzl

Вам не хватает точки с запятой после console.log ('item'). Основываясь на том, что вы упомянули, как насчет объявления elemList наверху /, где объявлен weatherList, чтобы вы могли получить к нему доступ за пределами вызова getJSON? –

Ваш json подделан, я думаю. использовать серверные функции для генерации данных json, поэтому у него не будет никаких скрытых символов. –

Спасибо за руководство! Я решил, что с добавлением кавычек:

[ 
    { 
    "name": "Prague", 
    "temp": "23" 
    }, 
    { 
    "name": "Hannover", 
    "temp": "34" 
    } 
]

Это хорошо работает.

источник

2015-02-20 07:45:47

Причиной этого является подделаны ваш JSON. Согласно jquery , если json-файл имеет синтаксические ошибки, тогда запрос будет молча пропустить.

Используйте функции на стороне сервера для создания данных json.

как сейчас ваш сервер отвечает с

{↵ name: 'Prague',↵ temp: '23'↵},↵{↵ name: 'Hannover',↵ temp: '34'↵}↵

который имеет синтаксические ошибки.

С JQuery Docs

Важно: На JQuery 1.4, если файл JSON содержит синтаксическую ошибку, запрос будет обычно не молча. По этой причине избегайте частого ручного редактирования данных JSON. JSON - это формат обмена данными с правилами синтаксиса , которые более строгие, чем те, которые имеют объект JavaScript . Например, все строки, представленные в JSON, , являются ли они свойствами или значениями, должны быть заключены в двойные кавычки. Подробнее о формате JSON см. http://json.org/.

источник

2015-02-17 10:17:39

«Если в файле json есть синтаксические ошибки, запрос будет бесшумно». Абсолютно. Спасибо! – JCarlos

ответ

Смежные вопросы