-1
我正在编写一个函数以根据某些存储的数据创建表格，在thead的第一个单元格中添加了tbody行中的所有单元格，我注意到，除去THEAD解决了这个问题，但我不喜欢删除thead因为它有利于在项目在表头的第一个单元格下添加新的表格行
这里其他的东西是函数
var courses = [
[{name:'xxx',room:'Seminar 1'},{name:'xxx',room:'Seminar 1'},{name:'xxx',room:'Seminar 1'},
{name:'zzz',room:'111'},{name:'zzz',room:'111'},{name:'zzz',room:'111'},{name:'Subject 3 - Instructor 3',room:'yyy'},{name:'Subject 4 - Instructor 4',room:'yyy'},{name:'Subject 5 - Instructor 5',room:'yyy'},{name:'Subject 5 - Instructor 5',room:'yyy'},{name:'Subject 6 - Instructor 6',room:'yyy'},{name:'Subject 6 - Instructor 6',room:'yyy'}],
[{name:'',room:'',room:''},{name:'',room:''},{name:'xyz',room:'Semniar 1'},{name:'xyz',room:'Semniar 1'},{name:'',room:''},{name:'x',room:'1'},{name:'x',room:'1'},{name:'t',room:'2'},{name:'y',room:'2'},{name:'y',room:'3'},{name:'y',room:'3'},{name:'',room:''}],
[{name:'',room:'',room:''},{name:'',room:''},{name:'',room:''},{name:'',room:''},{name:'',room:''},{name:'',room:''},{name:'',room:''},{name:'',room:''},{name:'',room:''},{name:'',room:''},{name:'',room:''},{name:'',room:''}],
[{name:'',room:'',room:''},{name:'',room:''},{name:'',room:''},{name:'',room:''},{name:'',room:''},{name:'',room:''},{name:'',room:''},{name:'',room:''},{name:'',room:''},{name:'',room:''},{name:'',room:''},{name:'',room:''}],
[{name:'',room:'',room:''},{name:'',room:''},{name:'',room:''},{name:'',room:''},{name:'',room:''},{name:'',room:''},{name:'',room:''},{name:'',room:''},{name:'',room:''},{name:'',room:''},{name:'',room:''},{name:'',room:''}],
[{name:'',room:'',room:''},{name:'',room:''},{name:'',room:''},{name:'',room:''},{name:'',room:''},{name:'',room:''},{name:'',room:''},{name:'',room:''},{name:'',room:''},{name:'',room:''},{name:'',room:''},{name:'',room:''}]
];
var days = ['Saturday','Sunday','Monday','Tuesday','Wednesday','Thursday'];
var slots = {start:'08:00',duration:'1:00',count:15,breaks:[4,8,12],break_duration:'0:20'};
var arr = [[3, 0, 0, 1, 3, 0, 0, 1, 1, 1, 1, 1, 1, 2, 0],
[1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 2, 0, 1],
[1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1],
[1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1],
[1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1],
[1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1]]
这里所需要的数据的功能创建表格
function tableCreate() {
var body = document.getElementById('tablediv');
var tbl = document.createElement('table');
tbl.setAttribute("id","myTable");
var thd = document.createElement('thead');
var row = document.createElement('tr');
thd.setAttribute("class","ant-table-thead");
var head = document.createElement('th')
head.setAttribute('rowspan',2);
head.setAttribute('colspan',1);
head.appendChild(document.createTextNode('Day'));
row.appendChild(head);
var start = slots.start,brk=0,end=undefined;
for(var i=0;i<2;i++)
{
for(var j=0;j<slots.count;j++)
{
head = document.createElement('th')
head.setAttribute('class','column1');
head.setAttribute('colspan',1);
if(i===0)
head.appendChild(document.createTextNode(j+1));
else{
if(slots.breaks.length>brk && j+1===slots.breaks[brk])
{
end = calcTo(start,slots.break_duration);
brk++;
}
else
end = calcTo(start,slots.duration);
head.appendChild(document.createTextNode(start+'-'+end));
start = end;
}
row.appendChild(head);
}
thd.appendChild(row);
row = document.createElement('tr');
}
tbl.appendChild(thd);
var tbd = document.createElement('tbdoy');
for(var i=0;i<days.length;i++)
{ brk=0;
for(var j=0;j<slots.count+1;j++)
{ var td = document.createElement('td');
if(j==0)
{
td.style.backgroundColor = 'rgb(156, 52, 104)';
td.style.color = 'rgb(255, 255, 255)';
td.style.textAlign = 'left';
td.appendChild(document.createTextNode(days[i]));
row.appendChild(td);
}
else{
td.setAttribute("class","column1");
if(slots.breaks.length>brk && j===slots.breaks[brk])
{
if(i===0)
{
td.setAttribute('rowspan',days.length);
td.appendChild(document.createTextNode('b'));
td.appendChild(document.createElement('br'));
td.appendChild(document.createTextNode('r'));
td.appendChild(document.createElement('br'));
td.appendChild(document.createTextNode('e'));
td.appendChild(document.createElement('br'));
td.appendChild(document.createTextNode('a'));
td.appendChild(document.createElement('br'));
td.appendChild(document.createTextNode('k'));
td.style.textAlign = 'center';
td.setAttribute("colspan",arr[i][j-1]);
row.appendChild(td);
}
brk++;
}
else{
var namespan = document.createElement('span');
var roomspan = document.createElement('span');
roomspan.style.color='red';
roomspan.style.verticalAlign='bottom';
roomspan.style.textAlign = 'right';
roomspan.appendChild(document.createTextNode(courses[i][j-1-brk].room));
namespan.style.textAlign = "center";
namespan.appendChild(document.createTextNode(courses[i][j-1-brk].name));
td.appendChild(namespan);
td.appendChild(roomspan);
td.setAttribute("colspan",arr[i][j-1]);
if(arr[i][j-1]>0)
row.appendChild(td);
}
}
}
tbd.appendChild(row);
row = document.createElement('tr');
}
tbl.appendChild(tbd);
body.appendChild(tbl);
}
助手功能calcTo：
function calcTo(from,dur)
{
var minfrom = parseInt(from.slice(from.indexOf(':')+1));
var mindur = parseInt(dur.slice(dur.indexOf(':')+1));
var hourfrom = parseInt(from.slice(0,from.indexOf(':')));
var hourdur = parseInt(dur.slice(0,dur.indexOf(':')));
var summin=minfrom+mindur,sumhour=hourfrom+hourdur;
if(summin > 59)
{
summin = 60-summin;
sumhour = sumhour+1;
}
if(sumhour > 23)
{
sumhour = 24 - sumhour;
}
return (sumhour<10?'0'+sumhour:sumhour)+":"+(summin<10?'0'+summin:summin);
}
遗憾的任何不便，如果有该问题的任何建议，请让我知道，因为这是我第一次发布，并在此先感谢。
编辑：我还注意到，如果我保存生成的html文件并打开保存的文件，表格被视为应该这意味着生成的html适当与正确的单元格对齐，所以我会认为它是脚本相关或东西
EDIT2：我提供的示例数据和有些适当的缩进，感谢和我一起应对，并试图帮助
我们不没有这个数据unction循环可用，所以我们无法准确再现您的问题。请提供[mcve]。 – CBroe
这个代码几乎不可能只是看和理解 - 缩进是一团糟。如果/ thens没有括号，它们可能是也可能不是bug，它会调用你没有包含的函数，它依赖于数据，我们必须猜测这些数据才能使代码正常工作。一些数据，如课程，似乎是多维数组。如果你不提供人们可以运行的东西，那将比大多数人想要帮助你做的工作多得多。 –
好的谢谢你的回应我将包括所需的数据 – PrettiSpaghetti