Question

我正在尝试在我的网站上为我的桌子的移动版本创建自己的脚本。

我目前正在使用下面的脚本来获取表的大小，并为每一行创建新表，将标题复制到每个新表中....（参见：http://api.jquerymobile.com/table-reflow/）以了解我想要实现的目标。

我的脚本如下，但是它们是底部包含的js小提琴，以获得更好的示例。

我的问题是我只能在每个表中创建1，每个表中应该真正为3行。再次检查下面的小提琴是否有正确的例子。任何人都可以看到为什么它只在表中创建一行？

<script>
$(document).ready(function(){
var TableSize = $("table thead tr th").not("table.mobile_table thead tr th").size(); // Get # of columns
var i = 1;
var TableRowCount = $("table tbody tr").size(); // Get # of body rows
$("table thead tr th").each(function(){
    $(this).attr("id", i++); // Give headers incrementing ID
});
for ( var CreateTables = 1;  CreateTables < TableRowCount; CreateTables++ ){ // Create new table           class="mobile_table" for each row 
$("table").after("<table class='mobile_table'></table>");
}   
$("table.mobile_table").each(function(){// Insert original headers into each row of new table as first column
 var h = 1;
 while ( ++h < TableSize){ // this is where the error is, it gives me the stuff below but x3 (the number of created tables)......

    $("table.mobile_table").after("<tr><td></td><td></td><td></td></tr>"); 

 }
});
console.log(TableSize);
console.log(TableRowCount);
});
  </script>

请参阅小提琴：http://jsfiddle.net/Yf7KV/

Answer 1

你的意思是这样的：http://jsfiddle.net/Yf7KV/2/

<强> JS

$(this).append("<tr><td class='mobile_col_1'>Col 1</td><td class='mobile_col_2'>Col 2</td></tr>");

解释：Append将全部依次追加元素。 html取代您目前拥有的

Jquery移动表回流

1 个答案: