У меня есть таблица, если она больше некоторого количества строк или размеров я ее делю на новую и вставляю разделить после нее для принудительного переноса страницы для печати. На практике у меня таблица может занимать 3 листа, поэтому я создаю две пустые таблицы
newfirstTable и
newsecondTable и затем заполняю их, если требуется. В конце я добавляю их после разделителя.
function(){
var sourceTable = $('#sourceTable');
var rowsHeight = 0;
var separator = $('<div style="page-break-before:always"></div>');
var newfirstTable = $('<table id="newfirstTable" border="0" cellspacing="0" cellpadding="2" width="100%"><tbody></tbody></table>');
var newsecondTable = $('<table id="newsecondTable" border="0" cellspacing="0" cellpadding="2" width="100%"><tbody></tbody></table>');
sourceTable.find('tr').each(function(i, ln){
var row = $(ln);
rowsHeight += row.innerHeight();
if(i > 60 || rowsHeight > 3000)
{
newsecondTable.append(row);
}
else if(i > 20 || rowsHeight > 1300)
{
newfirstTable.append(row);
}
});
var firstRow = sourceTable.find('tr:first').clone();
if(newfirstTable.find('tr').length > 0) {
sourceTable.after(separator);
newfirstTable.find('tr:first').before(firstRow);
sourceTable.next(separator).after(newfirstTable);
}
if(newsecondTable.find('tr').length > 0) {
newfirstTable.after('<div style="page-break-before:always"></div>');
newsecondTable.find('tr:first').before(firstRow);
newfirstTable.next(separator).after(newsecondTable);
}
}
Выше код работает как надо, но если строку
newfirstTable.after('<div style="page-break-before:always"></div>');
заменить на:
newfirstTable.after(separator);
То исходная таблица
sourceTable схлопнется с
newfirstTable, а
newsecondTable перенесется нормально.
Объясните почему?