将桌子旋转 90 度 [英] Rotate a table 90 degrees
本文介绍了将桌子旋转 90 度的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我有一张看起来像这样的桌子:
I have a table that looks something like this:
<table><tbody>
<tr><td>a</td><td>1</td></tr>
<tr><td>b</td><td>2</td></tr>
<tr><td>c</td><td>3</td></tr>
<tr><td>d</td><td>4</td></tr>
<tr><td>e</td><td>5</td></tr>
<tr><td>f</td><td>6</td></tr>
<tr><td>g</td><td>7</td></tr>
</tbody></table>
我需要它来达到这样的目的:
I need it to get to something like this:
<table><tbody>
<tr>
<td>a</td><td>b</td><td>c</td><td>d</td>
<td>e</td><td>f</td><td>g</td>
</tr>
<tr>
<td>1</td><td>2</td><td>3</td><td>4</td>
<td>5</td><td>6</td><td>7</td>
</tr>
</tbody></table>
我想这样的事情应该可行,但我有点迷茫,我该怎么办这:这是我开始的
我对 Javascript、jQuery 甚至 CSS 持开放态度.
I'm open to Javascript, jQuery or even CSS for this.
推荐答案
这是我的解决方案:http://jsfiddle.net/mtrwk/19/
$('table').each(function() {
$(this).after("<table><tbody></tbody></table>");
var newTable = $(this).next("table").children("tbody");
$(this).children("tbody").children("tr").each(function(rIndex, rItem){
$(this).children("td").each(function(dIndex, dItem){
if(newTable.children("tr:eq("+dIndex+")").html() == null){
newTable.append("<tr></tr>");
}
newTable.children("tr:eq("+dIndex+")").append($(this)[0].outerHTML);
});
});
});
这篇关于将桌子旋转 90 度的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文