针对上次表格编辑的打印问题及解决方案
对于上次的表格编辑，在打印过程中存在自动分页，表格不完整的问题，如下图：
如果表格高度超过A4纸张的高度，则会对表格自动分页，无法打印出完整的表格。
对此我想了很多办法：
1.有什么办法可以让它强制不分页？
2.有什么办法可以给标签分页？
3.分割表格，让其行数固定在A4纸张高度内？
经过查询资料：1.强制不分页不可行，2.有个样式page-break-before对打印分页有用，但是在table中无法使用，除非上下结构是独立的，3.最终选择的解决方案，给定行数，给他自动分页。
选择第三个解决方案，无外乎是逻辑最麻烦的一种，因为这涉及到tr和td的rowspan的分割而且对于上次的表格编辑是嵌套的rowspan分割，更加麻烦
实现思路：1.先找到要分割的tr，在分割的时候，先将当前tr的所在月份之前的表格提取，再将之后的表格提取，接下来就是对当前要分割的tr的月份列进行分割；
2.判断当前tr有没有月份列，如果有月分列则提取月份列，如果没有月份列则向上查找月份列，再判断是否有类别列，如果有则提取，如果没有则向上找；
3.将所在月份的当前tr的之前的行分割给之前的表格，将当前tr的之后的行分割给之后的表格；
对照画了一张逻辑图：
下面是代码：
1 var prevRows = 0; 2 var monthPrevRows = 0; 3 var pc = ""; 4 var countnum = true; 5 function myprint(xrows, tbl, printTitle) {//xrows是要分割的行数,tbl是传入table对象，printTitle是每页的标题 6 //alert("a"); 7 prevRows = 0; 8 monthPrevRows = 0; 9 var tblRows = $(tbl).find("tbody").find("tr").length; 10 if (tblRows <= xrows) { 11 pc += "<div style='text-align:center;'>" + printTitle + "</div><table>" + $(tbl).html() + "</table>"; 12 toPrint(pc); 13 return false; 14 } 15 var tableHead = $(tbl).find("thead"); 16 var xrows = parseInt(xrows); 17 var tarTr = $(tbl).find("tbody").find("tr").eq(xrows - 1); 18 //alert(tarTr.html()); 19 //获取当前子类TD 20 var cTypeTd = findTypeTd(tarTr); 21 //获取当前月TD 22 var cMonthTd = findMonthTd(tarTr); 23 /*分割月*/ 24 var cMonthTr = $(cMonthTd).parents("tr"); 25 prevRows = findPrevRows(cMonthTr, prevRows); 26 var cMonthTdRowspan = $(cMonthTd).attr("rowspan"); 27 var cMonthTdRowspan_1 = xrows - prevRows; 28 var cMonthTdRowspan_2 = cMonthTdRowspan - cMonthTdRowspan_1; 29 30 /// 31 var cMonthTd_1 = cMonthTr.find("td").eq(0).clone(); 32 var cMonthTd_2 = cMonthTr.find("td").eq(0).clone(); 33 $(cMonthTd_1).attr("rowspan", cMonthTdRowspan_1); 34 $(cMonthTd_2).attr("rowspan", cMonthTdRowspan_2); 35 /// 36 37 var cMonthTr_1 = cMonthTr.clone(); 38 $(cMonthTr_1).find("td").eq(0).attr("rowspan", cMonthTdRowspan_1); 39 var cMonthTr_2 = cMonthTr.clone(); 40 $(cMonthTr_2).find("td").eq(0).attr("rowspan", cMonthTdRowspan_2); 41 //prevRows = 0; 42 /*分割类*/ 43 var cTypeTr = $(cTypeTd).parents("tr"); 44 //alert(cTypeTr.html()); 45 monthPrevRows = findPrevRows(cTypeTr, monthPrevRows); 46 var cTypeTdRowspan = $(cTypeTd).attr("rowspan"); 47 var cTypeTdRowspan_1 = xrows - monthPrevRows; 48 var cTypeTdRowspan_2 = cTypeTdRowspan - cTypeTdRowspan_1; 49 //alert(cTypeTd.html()); 50 51 52 if (prevRows != monthPrevRows) { 53 var cTypeTr_1 = cTypeTr.clone(); 54 $(cTypeTr_1).find("td").eq(0).attr("rowspan", cTypeTdRowspan_1); 55 var cTypeTr_2 = cTypeTr.clone(); 56 $(cTypeTr_2).find("td").eq(0).attr("rowspan", cTypeTdRowspan_2); 57 } else { 58 var cTypeTr_1 = cMonthTr_1; 59 $(cTypeTr_1).find("td").eq(1).attr("rowspan", cTypeTdRowspan_1); 60 var cTypeTr_2 = cMonthTr_2; 61 $(cTypeTr_2).find("td").eq(1).attr("rowspan", cTypeTdRowspan_2); 62 } 63 //alert(monthPrevRows + "|" + prevRows); 64 /*分割行*/ 65 var tbody_1 = document.createElement("tbody"); 66 for (var i = 0; i < prevRows; i++) { 67 var itr = $(tbl).find("tbody").find("tr").eq(i).clone(); 68 $(tbody_1).append(itr); 69 } 70 var tbodytrrows = $(tbl).find("tbody").find("tr").length; //总Tr数 71 var cmonthtrrows = $(cMonthTd).attr("rowspan"); //分割的月的rowspan数 72 var statrnextrows = parseInt(prevRows) + parseInt(cmonthtrrows); //分割的月之前的行数（包含分割月） 73 var nextRows = tbodytrrows - statrnextrows; //分割的月的之后的行数 74 75 /////////////////////////////////////第一个分割表 76 //alert(prevRows + "|" + monthPrevRows); 77 if (prevRows != monthPrevRows) { 78 $(tbody_1).append(cMonthTr_1); 79 var monthprev = monthPrevRows - prevRows; 80 for (var i = 0; i < monthprev - 1; i++) { 81 cMonthTr = cMonthTr.next(); 82 var itr = cMonthTr.clone(); 83 $(tbody_1).append($(itr)); 84 } 85 $(tbody_1).append(cTypeTr_1); 86 for (var i = 0; i < cTypeTdRowspan_1 - 1; i++) { 87 cTypeTr = cTypeTr.next(); 88 var itr = cTypeTr.clone(); 89 $(tbody_1).append($(itr)); 90 } 91 } else { 92 $(tbody_1).append(cTypeTr_1); 93 for (var i = 0; i < cTypeTdRowspan_1 - 1; i++) { 94 cTypeTr = cTypeTr.next(); 95 var itr = cTypeTr.clone(); 96 $(tbody_1).append($(itr)); 97 } 98 } 99 // alert($(tbody_1).html()); 100 var table_1 = document.createElement("table"); 101 $(table_1).attr("class", "FormTable"); 102 $(table_1).append(tableHead.clone()); 103 $(table_1).append(tbody_1); 104 ///////////////////////////////////////第二个分割表 105 var tbody_2 = document.createElement("tbody"); 106 if (prevRows != monthPrevRows) { 107 var trEle = $(tbl).find("tbody").find("tr").eq(xrows).clone(); 108 var tdEle = $(cTypeTr_2).find("td").eq(0); 109 110 if (tdEle.attr("rowspan") != 0) { 111 $(tdEle).insertBefore(trEle.find("td").eq(0)); 112 } 113 if (cMonthTd_2.attr("rowspan") != 0) { 114 $(cMonthTd_2).insertBefore(trEle.find("td").eq(0)); 115 } 116 $(tbody_2).append(trEle); 117 } else { 118 var trEle = $(tbl).find("tbody").find("tr").eq(xrows).clone(); 119 var tdEle = $(cTypeTr_2).find("td").eq(0); 120 var tdEle_ = $(cTypeTr_2).find("td").eq(1); 121 if (tdEle_.attr("rowspan") != 0) { 122 $(tdEle_).insertBefore(trEle.find("td").eq(0)); 123 } 124 if (tdEle.attr("rowspan") != 0) { 125 $(tdEle).insertBefore(trEle.find("td").eq(0)); 126 127 } 128 $(tbody_2).append(trEle); 129 } 130 // for (var i = cTypeTdRowspan_1; i < cTypeTdRowspan; i++) { 131 // cTypeTr = cTypeTr.next(); 132 // var itr = cTypeTr.clone(); 133 // $(tbody_2).append($(itr)); 134 // } 135 136 for (var i = xrows + 1; i < tbodytrrows; i++) { 137 var itr = $(tbl).find("tbody").find("tr").eq(i).clone(); 138 $(tbody_2).append(itr); 139 } 140 141 var table_2 = document.createElement("table"); 142 $(table_2).attr("class", "FormTable"); 143 $(table_2).append(tableHead.clone()); 144 $(table_2).append(tbody_2); 145 if (countnum) { 146 pc += "<div style='text-align:center;'>" + printTitle + "</div><table class='FormTable'>" + $(table_1).html() + "</table>"; 147 } else { 148 pc += "<div style='page-break-before:always;text-align:center;'>" + printTitle + "</div><table class='FormTable'>" + $(table_1).html() + "</table>"; 149 } 150 if ($(table_2).find("tbody").find("tr").length > xrows) { 151 countnum =false; 152 prevRows = 0; 153 monthPrevRows = 0; 154 myprint(xrows, table_2,printTitle); 155 } else { 156 pc += "<div style='page-break-before:always;text-align:center;'>" + printTitle + "</div><table class='FormTable'>" + $(table_2).html() + "</table>"; 157 toPrint(pc); 158 } 159 160 //$(tbody_1).append(cTypeTr_1); 161 //cTypeTr_2.insertBefore($(tbody_2).find("tr").eq(0)); 162 163 164 } 165 166 function toPrint(printContent) { 167 if(printContent.indexOf("page-break-before:always;")<100) 168 { 169 printContent=printContent.replace("page-break-before:always;", ""); 170 } 171 var iss = $("#hlb").attr("checked"); 172 if (iss == "checked") { 173 iss = ""; 174 } else { 175 iss = ".hlb{display:none}"; 176 } 177 var isss = $("#dk").attr("checked"); 178 if (isss != null) { 179 if (isss == "checked") { 180 isss = ""; 181 } else { 182 isss = ".dk{display:none}"; 183 } 184 185 } 186 var printWindow = window.open('', '', ''); 187 printWindow.document.write('<html><head><link rel="stylesheet" href="../../style/Table.css" />' + 188 '<style>#ddy{display:none}'+iss+isss+'</style></head><body>' + printContent + '</body></html>'); 189 setTimeout(function () { 190 printWindow.focus(); 191 printWindow.print(); 192 printWindow.close(); 193 }, 200); 194 pc = ""; 195 } 196 197 function findPrevRows(tr, prevRows) { 198 tr = $(tr).prev(); 199 if (tr.html() == null) { 200 return prevRows; 201 } else { 202 prevRows++; 203 return findPrevRows(tr, prevRows); 204 } 205 } 206 207 function findTypeTd(tr) { 208 //获取当前TR下的第一个TD 209 var typetd = tr.find("td").eq(0); 210 if (typetd.html().indexOf("月份") != -1) { 211 return tr.find("td").eq(1); 212 } else if (typetd.html().indexOf("typename") == -1) { 213 tr = $(tr).prev(); //向上推一个TR 214 return findTypeTd(tr); //传入 215 } else { 216 return typetd; 217 } 218 } 219 function findMonthTd(tr) { 220 //获取当前TR下的第一个TD 221 var monthtd = tr.find("td").eq(0); 222 //如果不包含"月份"关键字 223 if (monthtd.html().indexOf("月份") == -1) { 224 tr = $(tr).prev(); //向上推一个TR 225 return findMonthTd(tr); //传入 226 } else { 227 return monthtd; 228 } 229 }
最终的打印效果：
可以将2月份的三行正确的分割出来，并且此代码做了递归操作，可以将分割之后的部分如果超过纸张长度再次分割。
