не может получать данные из внешнего локального json

Question

не может получать данные из внешнего локального json

Я пытаюсь показать окно «предупреждение» с текстом из файла JSON. Но похоже, что я не могу получить данные из своего файла JSON. Он просто не бросает предупреждение.

var thebook = JSON.parse(book);

function showAlert() {
  alert(thebook[0].word);
}

<head>
  <script type="text/javascript" src="book.json"></script>
</head>

<body>
  <button onclick="showAlert()">show alert</button>
</body>

И пример файла JSON

[
  {
    "word" : "cuiller",
    "page" : 23
  },
  
  {
    "word" : "arbre ",
    "page" : 245
  }
]

javascript,json,

0

Ответов: 3

JavaScript, JSON,

Похожие вопросы

score 1 · Accepted Answer

1

В book.jsonвашем хранилище JSON хранится в переменной (как var bookуказано ниже).

var book = [
  {
    "word" : "cuiller",
    "page" : 23
  },

  {
    "word" : "arbre ",
    "page" : 245
  }
];

Строгайте его перед разбором / предупреждением.

thebook = JSON.parse(JSON.stringify(book));

function showAlert() {
  alert(thebook[0].word);
}

Рабочая ссылка JSFiddle: https://jsfiddle.net/h5knqobs/9/

Надеюсь это поможет!

score 1 · Accepted Answer

1

вам нужно запросить ресурс из вашего JS-кода, а не просто ссылаться на него, вы можете сделать это с помощью XMLHttpRequest, который вернет текст из файла, затем вы можете проанализировать текст в объекте с использованием JSON.parse

Пример будет выглядеть так:

var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function() {
  if (this.readyState == 4 && this.status == 200) {
    var myObj = JSON.parse(this.responseText);
    document.getElementById("demo").innerHTML = myObj.name;
  }
};
xmlhttp.open("GET", "json_demo.txt", true);
xmlhttp.send();

https://www.w3schools.com/js/js_json_parse.asp

score 1 · Accepted Answer

1

Вот как вы извлекаете JSON из файла

var book = (function() {
    var json = null;
    $.ajax({
        'async': false,
        'global': false,
        'url': "/book.json",
        'dataType': "json",
        'success': function (data) {
            json = data;
        }
    });
    return json;
})();

После того как вы сохраните значение JSON в переменной, проанализируйте его так.

var thebook = JSON.parse(JSON.stringify(book));

РЕДАКТИРОВАТЬ

Вот лучшая версия моего ответа

var book = null;
$.ajax({
    'async': false,
    'global': false,
    'url': "/test.json",
    'dataType': "json",
    'success': function (data) {
        book = data;
    }
});

В вашей showAlertфункции вы можете просто позвонить book[0].word.