javascript - 从脚本中获取真或假(来自 JSON 文件)以显示为复选框
问题描述
所以我使用这个脚本从谷歌表格中获取值
$.getJSON("https://spreadsheets.google.com/feeds/list/1nPL4wFITrwgz2_alxLnO9VBhJQ7QHuif9nFXurgdSUk/1/public/values?alt=json", function(data) {
var sheetData = data.feed.entry;
var i;
for (i = 0; i < sheetData.length; i++) {
var timestamp = data.feed.entry[i]['gsx$timestamp']['$t'];
var checkin = data.feed.entry[i]['gsx$checkin']['$t'];
var teamname = data.feed.entry[i]['gsx$teamname']['$t'];
var capdiscord = data.feed.entry[i]['gsx$captainsdiscord']['$t'];
var adc = data.feed.entry[i]['gsx$adc']['$t'];
var support = data.feed.entry[i]['gsx$support']['$t'];
var mid = data.feed.entry[i]['gsx$mid']['$t'];
var jungle = data.feed.entry[i]['gsx$jungle']['$t'];
var solo = data.feed.entry[i]['gsx$solo']['$t'];
var sub1 = data.feed.entry[i]['gsx$sub1']['$t'];
var sub2 = data.feed.entry[i]['gsx$sub2']['$t'];
var sub3 = data.feed.entry[i]['gsx$sub3']['$t'];
var seeding = data.feed.entry[i]['gsx$seeding']['$t'];
document.getElementById('demo').innerHTML += (
'<tr>' + '<td>' + timestamp +
'</td>' + '<td>' + checkin +
'</td>' + '<td>' + teamname +
'</td>' + '<td>' + capdiscord +
'</td>' + '<td>' + adc +
'</td>' + '<td>' + support +
'</td>' + '<td>' + mid +
'</td>' + '<td>' + jungle +
'</td>' + '<td>' + solo +
'</td>' + '<td>' + sub1 +
'</td>' + '<td>' + sub2 +
'</td>' + '<td>' + sub3 +
'</td>' + '<td>' + seeding +
'</td>' + '</tr>');
}
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="demo"></div>
checkin 是一个真值或假值。我希望它是一个实际的复选框,如果为真则检查它,如果为假则不检查。我该怎么写这个?
解决方案
如果 true 添加checked
到输入 html
$.getJSON("https://spreadsheets.google.com/feeds/list/1nPL4wFITrwgz2_alxLnO9VBhJQ7QHuif9nFXurgdSUk/1/public/values?alt=json", function(data) {
var sheetData = data.feed.entry;
var i;
for (i = 0; i < sheetData.length; i++) {
var timestamp = data.feed.entry[i]['gsx$timestamp']['$t'];
var checkin = data.feed.entry[i]['gsx$checkin']['$t'];
var teamname = data.feed.entry[i]['gsx$teamname']['$t'];
var capdiscord = data.feed.entry[i]['gsx$captainsdiscord']['$t'];
var adc = data.feed.entry[i]['gsx$adc']['$t'];
var support = data.feed.entry[i]['gsx$support']['$t'];
var mid = data.feed.entry[i]['gsx$mid']['$t'];
var jungle = data.feed.entry[i]['gsx$jungle']['$t'];
var solo = data.feed.entry[i]['gsx$solo']['$t'];
var sub1 = data.feed.entry[i]['gsx$sub1']['$t'];
var sub2 = data.feed.entry[i]['gsx$sub2']['$t'];
var sub3 = data.feed.entry[i]['gsx$sub3']['$t'];
var seeding = data.feed.entry[i]['gsx$seeding']['$t'];
if(checkin == 'TRUE'){
checkin = 'checked';
}else{
checkin = '';
}
document.getElementById('demo').innerHTML += (
'<table><tr>' + '<td>' + timestamp +
'</td>' + '<td><input type="checkbox" ' + checkin +' />' +
'</td>' + '<td>' + teamname +
'</td>' + '<td>' + capdiscord +
'</td>' + '<td>' + adc +
'</td>' + '<td>' + support +
'</td>' + '<td>' + mid +
'</td>' + '<td>' + jungle +
'</td>' + '<td>' + solo +
'</td>' + '<td>' + sub1 +
'</td>' + '<td>' + sub2 +
'</td>' + '<td>' + sub3 +
'</td>' + '<td>' + seeding +
'</td>' + '</tr></table>');
}
});
table, td, tr {
border: 1px solid black;
}
table {
border-collapse: collapse;
width: 100%;
}
th {
height: 50px;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="demo"></div>
推荐阅读
- javascript - 使用 setTimeout 分解长时间运行的函数以允许事件处理
- javascript - javascript window.open _blank 地址栏被锁定
- ms-access - 没有打开 VBA 编辑器,宏不起作用
- javascript - 在 javascript 和 reactjs 上对表格进行排序
- vba - 将页脚值拉为字符串
- scala - scala 文本中单词之间的绝对最小距离
- excel - 将范围复制到不同工作表中的下一个可用单元格
- git - 在 GitLab 上,如何比较两个不同提交的文件
- c# - 如何允许 python 脚本(在 C# 应用程序中调用)访问 USB 端口
- html - 让文本在底部 div 对齐