Question

无法弄清楚如何实际解决此问题。我在getJson方法之前和之后都有一个打印线到控制台，只有前一个。

以下是我在控制台上遇到的错误：

我已经对路径进行了很多混乱，这似乎不是问题，我已经确认我的JSON是准确的。这是我的JavaScript代码

$(document).ready(function () {
    var myList;
    console.log("here");
    $.getJSON('/vegetables.json').done(function (data) {
        console.log("also here");
        myList = data;
        //console.log(myList['vegetables'][0].name);

        var uList = document.getElementById("items");
        for (i = 0; i < myList['vegetables'].length; i++) {

            var div = document.createElement('div');
            div.setAttribute('class', 'col-sm-3 vegetables');

            var name = document.createElement('h3');
            name.innerHTML = myList['vegetables'][i].name;
            div.appendChild(name);

            var description = document.createElement('p');
            description.innerHTML = myList['vegetables'][i].description;
            div.appendChild(description);

            var price = document.createElement('p');
            price.innerHTML = myList['vegetables'][i].price;
            div.appendChild(price);

            var addToCart = document.createElement('button');
            addToCart.setAttribute('value', i);
            addToCart.setAttribute('class', 'btn btn-primary');
            addToCart.innerHTML = "Add to Cart <img src='glyphicons-203-shopping-cart.png' />";
            addToCart.setAttribute('onClick', 'carrot(this)');
            div.appendChild(addToCart);

           /*<div class="col-sm-3 vegetables" >

                     <h3 id="div1Name"></h3>
                     <p id="div1Description">Carrots are orange </p>
                     <p id="div1Price"></p>
                     <button onclick="carrot(this)" type="button" class="btn btn-primary" />Add to Cart <img src="glyphicons-203-shopping-cart.png" />
                 </div>*/

            //li.appendChild(panel);
            uList.appendChild(div);
        }
    });
    });

jQuery的头标记

<head>
<title>Vegetable</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="main.css">
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>

如果有任何其他方法有帮助，请告诉我。

Answer 1

它正在您的服务器地址上搜索文件，your_server_addr / vegetables.json（EX localhost：8080 / vegetables.json）并且此位置没有文件。

代码没有进入$ .getJson方法，因为它获得了404

1 个答案: