Question

我正在尝试用div替换所有表，以便在Twitter Bootstrap中使其列可堆叠。这样人们仍然可以在后端使用Tinymce来轻松创建表格，但它们不会破坏响应式设计。 Zurb响应表并没有削减它。

问题在于bootstrap div基于12列的总宽度（span5，span7等），因此只要表有更多或更少的列，div类就需要更改。我想我需要一个可以计算表中列数的JS，然后在重新排序内容时替换那些具有正确类的div的那些。因此，例如，对于两列表，类将是“span6”。对于四列表，它们将是“span3”。 Table标签被替换为“row”类的div

这超出了我的JS知识，任何人都可以伸出援助之手或拥有更优雅的解决方案，仍然可以在wysiwyg中进行简单的后端编辑？

Answer 1

应该能够做到这一点。以下是示例代码：

var table = $('table'),
    div = $('<div />');

$('td', table).each(function(){
    $('<div />').html($(this).html()).appendTo(div);
});

table.after(div).remove();

并演示：http://jsfiddle.net/tkirda/7GM5w/

jQuery用Bootstrap Div替换表元素

1 个答案: