带有垂直行的 HTML 表格 [英] HTML Table with vertical rows
问题描述
如何在 HTML 中制作垂直表格?垂直,我的意思是行将是垂直的,表格标题在左侧.
How do I make vertical tables in HTML? By vertical, I mean the rows will be vertical with table headers on the left.
我也需要它,这样我就可以像在普通表中一样访问这些行(在这种情况下是垂直的),使用 I also need it the way so I can access these rows (in this case vertical) as in a normal table, with 您可以使用 You can use @vishesh 所以你想在 DOM 准备好后转置你的表格?试试这个 http://gist.github.com/pgaertig/2376975 @vishesh so you want to transpose your table after DOM ready? try this http://gist.github.com/pgaertig/2376975 这篇关于带有垂直行的 HTML 表格的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!.这是因为我动态获取一行的数据(如 A 行)并将其插入表中.我使用 angularJS 来避免 DOM 操作,所以我不是在寻找使用 Javascript 进行复杂的 DOM 操作.
<tr>
. This is because I get the data dynamically for one row (like for row A) and insert it in the table. I am using angularJS to avoid DOM manipulation, so I am not looking for complex DOM manipulation with Javascript.推荐答案
作为行中的第一个单元格.这是一个小提琴:http://jsfiddle.net/w5nWG/
<th>
as the first cell in the row.
Here's a fiddle: http://jsfiddle.net/w5nWG/$(function() {
var t = $('#thetable tbody').eq(0);
var r = t.find('tr');
var cols= r.length;
var rows= r.eq(0).find('td').length;
var cell, next, tem, i = 0;
var tb= $('<tbody></tbody>');
while(i<rows){
cell= 0;
tem= $('<tr></tr>');
while(cell<cols){
next= r.eq(cell++).find('td').eq(0);
tem.append(next);
}
tb.append(tem);
++i;
}
$('#thetable').append(tb);
$('#thetable').show();
}
登录
关闭