无法使.getJSON触发onclick

时间:2018-11-07 19:58:46

标签: javascript html json onclick

我正在尝试获取“ restapp”功能来触发onclick,但它似乎无法正常工作。我不确定是什么问题。有什么建议吗?

这是我的代码:

<html>
<head>
  <title>Restaurant App</title>
</head>
<body>

<input id="info" type="button" onclick="restapp()" value="Create Table From JSON">

<hr>
<pre id="demo"></pre>

<script>
result = [];
city = 'chicago';
opURL = 'http://opentable.herokuapp.com/api/restaurants?city=' + city;

function restapp() {
    $.getJSON(opURL, function(data) {
        //data is the JSON string
        for (i=0; i<data.restaurants.length; i++) {
            result.push("Name: " + 
            data.restaurants[i].name);
                result.push("Address: " + 
            data.restaurants[i].address);
                result.push("Price: " + 
            data.restaurants[i].price);
                result.push("<br>");
            }
        document.getElementById("demo").innerHTML = JSON.stringify(result, null, 2);
    });
}

</script>

</body>
</html>

2 个答案:

答案 0 :(得分:0)

您的JQuery在哪里?

$。getJSON需要JQuery。检查您的浏览器控制台中是否有错误。

<script
  src="https://code.jquery.com/jquery-3.3.1.min.js"
  integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="
  crossorigin="anonymous"></script>

将此插入您的head标签中。

您可以使用JQuery选择器选择输入字段,并为click事件使用click方法。

答案 1 :(得分:0)

似乎有些放错了功能的括号。我已经将innerHTML插入作为后继处理程序:

function restapp() {
    $.getJSON(opURL, function(data) {
        //data is the JSON string
        for (i=0; i<data.restaurants.length; i++) {
            result.push("Name: " + 
            data.restaurants[i].name);
                result.push("Address: " + 
            data.restaurants[i].address);
                result.push("Price: " + 
            data.restaurants[i].price);
                result.push("<br>");
        }
    }).document.getElementById("demo").innerHTML = JSON.stringify(result, null, 2);    
}