Question

我尝试使用javascript和ajax自动显示来自外部网页的内容。页面或错误控制台中不显示任何内容。有人能看出我的问题是什么吗？非常感谢！ HTML：

    <!DOCTYPE HTML>
    <html>
        <head>
            <title>Stocks</title>
            <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js">                 </script>
            <script src="projectstocks.js"></script>
        </head>
        <body>
        <div>
        <content id="content">

        </content></div>
        </body>
     </html>

projectstocks.js：

    window.onload = function() {
var stocks = [];
var content = document.getElementById("content");
update();
setInterval("getData()", 1000);
}

function getData(data) {
content.innerHTML = "";
var tbod = document.getElementById("stocks");
var myTable= "<table id='table' border='1'>";
for(var i = 0; i < data.length; i++) {
    var tr = document.createElement('tr');
    var obj = data[i];
    for(key in obj){
        console.log(key);
        var value=(obj[key]);
        console.log(value);
        content.innerHTML += ("<tr><td>");
        content.innerHTML += ((obj[key]));
        content.innerHTML += ("<br><br></td></tr>");
    }
}
myTable+="</table>";
}

function update() {
$.getJSON('http://shodor.org/~amalani/AjaxTutorial/stocks/stocks.php?symbols=GOOG+CAT+FB', getData);
 }

再次感谢！这不一定非常花哨，请告诉我是否有我不需要的东西。

Answer 1

您的函数getData并未真正获取任何数据。它显示您在第一个参数中传递给它的数据。

使用setInterval("getData()", 1000);您重复调用该函数，但没有数据会导致数据无法显示。

相反，您应该在该时间间隔内调用函数update。因为此函数实际上会获取新数据并在加载时查看它。

<强>更新

正如@kapa所说，getData也有错误。请检查;）

您无缘无故地执行var tbod = document.getElementById("stocks");，因为您无法在任何地方使用该变量。
您无缘无故地执行var myTable= "<table id='table' border='1'>";和myTable+="</table>";，因为您无法在任何地方使用该变量。
您无缘无故地var tr = document.createElement('tr');，因为您无法在任何地方使用该行

这甚至都不是代码中的所有问题。我建议你再完全重复一遍;）

<强>更新

由于您似乎在搜索已完成的代码，我可以告诉您固定viewData的外观如何：

var content = document.getElementById("content");

function viewData(data) {
    var html = "<table id='table' border='1'>"; //we'll store our html in this variable
    for(var i = 0; i < data.length; i++) {
        var obj = data[i];
        for(var key in obj){
            html += "<tr><td>"; //continue to build our html
            html += obj[key];
            html += "<br><br></td></tr>";
        }
    }
    content.innerHTML= html+"</table>"; //now that the html is finished, define it as our content
}

请注意，您始终必须使用数据调用此功能。例如：

viewData([{"name":"Google Inc.","symbol":"GOOG","price":59055,"open":58902},{"name":"Caterpillar, Inc.","symbol":"CAT","price":10370,"open":10485},{"name":"Facebook, Inc.","symbol":"FB","price":7491,"open":7519}]);

使用javascript和ajax更新页面

1 个答案: