我正在获取JSON值并将它们显示在JQuery表中。有些值称为"成功","失败"和#34; Aborted"。我想用Success.png,Failed.png和Aborted.png的图像图标显示它们。你能帮我解决一下这个问题吗?提前谢谢。
以下是我到目前为止使用的Json和JQuery表:
$.post( "/portal/controllers/apis/test.jag",{
action: "getData"
}, function(data) {
var result = JSON.parse(data);
console.log("----------------------------------start----------------------------");
$("#tableid").append("<tr><td> Product </td> <td > Day01 </td> <td> Day02 </td> <td> Day03 </td><td> Day07 </td><td> Components </td> </tr>");
for (var i=0; i<result.length; i++) {
$("#tableid").append("<tr><td>" + result[i].product + "</td><td>" + result[i].Day01 +
"</td><td>" + result[i].Day02 + "</td><td>" + result[i].Day03 +
"</td><td>" + result[i].Day07 + "</td><td>" + result[i].Component + "</td></tr>");
}
});
Json数据
{
"Product":"APIM",
"Day01":"Success",
"Day02":"Aborted",
"Day03":"Failed",
"Day04":"Failed",
"Day05":"Failed",
"Day06":"Failed",
"Day07":"Success"
},
{
"Product":"AppFactory",
"Day01":"Aborted",
"Day02":"Success",
"Day03":"Success",
"Day04":"Success",
"Day05":"Success",
"Day06":"Success",
"Day07":"Success"
},
答案 0 :(得分:0)
<html>
<head>
<title>My title</title>
<script src="js/jquery.min.js"></script>
<script>
var result = [{
"Product": "APIM",
"Day01": "Success",
"Day02": "Aborted",
"Day03": "Failed",
"Day04": "Failed",
"Day05": "Failed",
"Day06": "Failed",
"Day07": "Success"
},
{
"Product": "AppFactory",
"Day01": "Aborted",
"Day02": "Success",
"Day03": "Success",
"Day04": "Success",
"Day05": "Success",
"Day06": "Success",
"Day07": "Success"
}];
window.onload = function () {
for (var i = 0; i < result.length; i++) {
$("#tableid").append("<tr><td>" + result[i].Product + "</td><td><img src='" + result[i].Day01 + ".png' />" +
"</td><td><img src='" + result[i].Day02 + ".png' /></td><td><img src='" + result[i].Day03 + ".png' />" +
"</td><td><img src='" + result[i].Day07 + ".png' /></td><td><img src='" + result[i].Component + ".png' /></td></tr>");
}
}
</script>
</head>
<body>
<table id="tableid"></table>
</body>
</html>