2013-11-20 57 views
0

我想從JSON中提取一些數據並將其放入表中。 Firefox和Chrome僅顯示空白頁面。 Webconsole不會發布任何錯誤。我的代碼有什麼問題?JSON表不會顯示

<!DOCTYPE html> 
<html> 
<head> 
<title>test</title> 
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>  
</head> 
<body> 
<script type="text/javascript"> 
$(document).ready(function(){ 
     $.getJSON('./url.php', function(data) { 
      var cars = data.rec.vehicles.vehicles; 
      $.each(cars, function(key, data){ 
       console.log(data.carName); 
       $('#usertable').append(
        function() { 
         return "<tr>"+ 
            "<td>"+data.carName+"</td>"+ 
            "<td>"+data.model+"</td>"+ 
            "<td>"+data.fuelState+"</td>"+ 
            "<td>1</td>"+ 
           "<tr>"; 
        } 
       ); 
      }) 
     }); 
    }); 
</script> 
</body> 
</html> 
+2

沒有在你的HTML標識'usertable'沒有元素。 'console.log(data.carName);'調用是否有效? – 2013-11-20 14:16:36

+0

我需要具體改變什麼?呼叫是有效的,是的。 – user2718017

+0

更好的複製粘貼在這裏也是一個很好的答案 - 顯然他是從某處複製它的,但從來沒有真正看過它的功能 – nrathaus

回答

0

在您的HTML中沒有ID爲usertable的元素。 jQuery沒有地方追加tr元素。

HTML:

<table id="usertable"> 
</table> 

的JavaScript:

var cars = [{ 
    carName: "Car 1", 
    model: "model 1", 
    fuelState: "full" 
}, { 
    carName: "Car 2", 
    model: "model 2", 
    fuelState: "full" 
}, { 
    carName: "Car 3", 
    model: "model 1", 
    fuelState: "half" 
}, { 
    carName: "Car 4", 
    model: "model 2", 
    fuelState: "half" 
}, { 
    carName: "Car 5", 
    model: "model 1", 
    fuelState: "empty" 
}]; 

$.each(cars, function (key, data) { 
    console.log(data.carName); 
    $('#usertable').append(

    function() { 
     return "<tr>" + 
      "<td>" + data.carName + "</td>" + 
      "<td>" + data.model + "</td>" + 
      "<td>" + data.fuelState + "</td>" + 
      "<td>1</td>" + 
      "<tr>"; 
    }); 
}) 

http://jsfiddle.net/lutzhorn/v6A3A/4/