场景: 我从外部 json 文件中获取数据,对其进行解析,然后将其附加到使用 footable jquery 插件的 HTML 表格。
问题: 这是一个完全菜鸟的问题......但是有没有人知道(或可以提供一个例子)如何使用 javascript 来解析那个 json 文件......并取决于其中一个名称/值对的值, 在表格中以不同颜色显示该文本?目前,一切都以纯文本显示。
COPD_QUAL.MED_ASSESS 是我希望根据值不同显示的对象。所以我需要类似的东西......
如果 COPD_QUAL.MED_ASSESS == "轻度恶化"......以绿色粗体文本显示
如果 COPD_QUAL.MED_ASSESS == "中度恶化"......以黄色粗体文本显示
如果 COPD_QUAL.MED_ASSESS == "严重恶化"......以红色粗体文本显示
下面是我目前将数据附加到表中的方式。任何人都可以帮助合并 if/condition 来完成上述任务吗?我是否需要将它添加到我的 createPatientTable 函数中?
if (window.location.hostname == 'localhost') {
console.log('local');
$.ajax({
type : 'GET',
url : 'json/gtw_copd_mpage3.json',
dataType : 'json',
success : function(json) {
createPatientTable(json);
},
error: function (xhr, ajaxOptions, thrownError) {
alert(xhr.status);
alert(thrownError);
}
});
}else{
var getPatients = new XMLCclRequest();
getPatients.onreadystatechange = function () {
if (getPatients.readyState == 4 && getPatients.status == 200) {
var json = $.parseJSON(getPatients.responseText);
createPatientTable(json);
};
}
};
});
function createPatientTable(json) {
$.each(json.LIST, function(i, COPD_QUAL) {
$('.footable > tbody:last').append('<tr><td>' + COPD_QUAL.PATIENT + '</td><td>' + COPD_QUAL.FIN +'</td><td>' + COPD_QUAL.NURSE_UNIT + '</td><td>' + COPD_QUAL.ROOM + '</td><td>' + COPD_QUAL.BED +'</td><td>' + COPD_QUAL.ATTENDING_PHYS + '</td><td>' + COPD_QUAL.LENGTH_OF_STAY + '</td><td>' + COPD_QUAL.MED_ASSESS + '</td></tr>');
});
$('.footable').footable();
};
这是文件中的一个 json 数组:
{"COPD_QUAL":"15","LIST":[ {"PATIENT":"TEST, TRICKLE","FIN":"70100905","NURSE_UNIT":"TIC","ROOM":"C219","BED":"A","ATTENDING_PHYS":"LEVITEN , DANIEL L","LENGTH_OF_STAY":"161days 20:15:24","MED_ASSESS":"Mild exacerbation"}...
最佳答案
我的建议是这样的:
/* ... */
+ '</td><td>' + COPD_QUAL.LENGTH_OF_STAY +
'</td><td class="assessment ' + getSeverity(COPD_QUAL.MED_ASSESS) + '">' +
COPD_QUAL.MED_ASSESS + '</td></tr>')
与
getSeverity = (function() {
var lookup = {
"Mild exacerbation": "mild",
"Moderate exacerbation": "moderate",
"Severe exacerbation": "severe" // presumably you didn't mean two milds...
};
var defaultValue = "unknown"
return function(assessment) {
return lookup[assessment] || defaultValue;
};
}());
和 CSS 类似:
.assessment {font-weight: bold;}
.mild {color: green;}
.moderate {color: yellow;}
.severe {color: red;}
关于javascript - 如何解析 json 并根据值在 HTML 表中显示不同的颜色?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22771021/