私はこれらのような複数のテーブルを持っています1st table 2nd table これらのテーブルの行を別々のページに分割したいと思います。各ページには15行または20行が含まれ、1番目の表の分離が完了すると2番目の表が開始されます。 これらのコードは、プリントを削除したいときに、次のページに先頭のテキストを繰り返します。Jquery複数のテーブル行を別々のページで分割する印刷するとき
jQuery(document).ready(function() {
for (i = 0; i < document.getElementsByClassName("testInfoTable").length; i++) {
document.getElementsByClassName("testInfoTable")[i].style.pageBreakBefore = "always";
}
var div_pageBreaker = '<div style="page-break-before:always;"></div>';
var per_page = 15;
\t
$('.testInfoTable').each(function(index, element) {
var pages = Math.ceil($(element).find('tbody tr').length/per_page);
if (pages == 1) {
return;
}
var table_to_split = $(element);
var current_page = 1;
\t \t for (current_page = 1; current_page <= pages; current_page++) {
\t \t var cloned_table = table_to_split.clone();
\t \t $('tbody tr', table_to_split).each(function(loop, row_element) {
\t \t \t if (loop >= per_page) {
\t \t \t $(row_element).remove();
}
});
\t \t $('tbody tr', cloned_table).each(function(loop, row_element) {
\t \t \t if (loop < per_page) {
\t \t \t $(row_element).remove();
}
});
\t \t if (current_page < pages) {
if (cloned_table.find('tbody tr').length > 0) {
\t \t \t $(element).find(".text").html("What");
\t \t \t \t $(cloned_table).find("h4").html("What");
\t \t \t \t $(div_pageBreaker).appendTo($(element));
\t \t \t \t $(cloned_table).appendTo($(element));
\t \t \t
}
}
//make a break
table_to_split = cloned_table;
}
});
});
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<link rel="stylesheet" href="style.css" />
<script src="script.js"></script>
</head>
<body>
<script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.1.1.min.js"></script>
<div>
<table class="testInfoTable">
<thead>
\t \t <tr><th> Table 1 Head 1</th> </tr>
\t \t <tr><th> <div>Table 1 Head 2</div></th> </tr>
\t \t <tr><th> <div>Table 1 Head 3</div></th> </tr>
\t \t <tr>
\t \t \t <th>
\t \t \t \t <h4 class="text">Head Text : Table 1</h4>
\t \t \t </th>
\t \t </tr>
</thead>
<tbody>
\t \t <tr><td>1</td> <td>1</td> <td>1</td></tr>
\t \t <tr><td>2</td> <td>1</td> <td>1</td> </tr>
\t \t <tr><td>3</td> <td>1</td> <td>1</td> </tr>
\t \t <tr><td>4</td> <td>1</td> <td>1</td> </tr>
\t \t <tr><td>5</td> <td>1</td> <td>1</td> </tr>
\t \t <tr><td>6</td> <td>1</td> <td>1</td> </tr>
\t \t <tr><td>7</td> <td>1</td> <td>1</td> </tr>
\t \t <tr><td>8</td> <td>1</td> <td>1</td> </tr>
\t \t <tr><td>9</td> <td>1</td> <td>1</td> </tr>
\t \t <tr><td>10</td> <td>1</td> <td>1</td> </tr>
\t \t <tr><td>11</td> <td>1</td> <td>1</td> </tr>
\t \t <tr><td>12</td> <td>1</td> <td>1</td> </tr>
\t \t <tr><td>13</td> <td>1</td> <td>1</td> </tr>
\t \t <tr><td>14</td> <td>1</td> <td>1</td> </tr>
\t \t <tr><td>15</td> <td>1</td> <td>1</td> </tr>
\t \t <tr><td>16</td> <td>1</td> <td>1</td> </tr>
\t \t <tr><td>17</td> <td>1</td> <td>1</td> </tr>
\t \t <tr><td>18</td> <td>1</td> <td>1</td> </tr>
\t \t <tr><td>19</td> <td>1</td> <td>1</td> </tr>
\t \t <tr><td>20</td> <td>1</td> <td>1</td> </tr>
\t \t <tr><td>21</td> <td>1</td> <td>1</td> </tr>
\t \t <tr><td>22</td> <td>1</td> <td>1</td> </tr>
\t \t <tr><td>23</td> <td>1</td> <td>1</td> </tr>
\t \t <tr><td>24</td> <td>1</td> <td>1</td> </tr>
\t \t <tr><td>25</td> <td>1</td> <td>1</td> </tr>
\t \t <tr><td>26</td> <td>1</td> <td>1</td> </tr>
\t \t <tr><td>27</td> <td>1</td> <td>1</td> </tr>
\t \t <tr><td>28</td> <td>1</td> <td>1</td> </tr>
\t \t <tr><td>29</td> <td>1</td> <td>1</td> </tr>
\t \t <tr><td>30</td> <td>1</td> <td>1</td> </tr>
\t \t <tr><td>31</td> <td>1</td> <td>1</td> </tr>
\t \t <tr><td>32</td> <td>1</td> <td>1</td> </tr>
\t </tbody>
</table>
<table class="testInfoTable">
<thead>
\t \t <tr><th> Table 2 Head 1</th> </tr>
\t \t <tr><th> <div>Table 2 Head 2</div></th> </tr>
\t \t <tr><th> <div>Table 2 Head 3</div></th> </tr>
\t \t <tr>
\t \t \t <th>
\t \t \t \t <h4 class="text">Head Text : Table 2</h4>
\t \t \t </th>
\t \t </tr>
</thead>
<tbody>
\t \t <tr><td>1</td> <td>1</td> <td>1</td></tr>
\t \t <tr><td>2</td> <td>1</td> <td>1</td> </tr>
\t \t <tr><td>3</td> <td>1</td> <td>1</td> </tr>
\t \t <tr><td>4</td> <td>1</td> <td>1</td> </tr>
\t \t <tr><td>5</td> <td>1</td> <td>1</td> </tr>
\t \t <tr><td>6</td> <td>1</td> <td>1</td> </tr>
\t \t <tr><td>7</td> <td>1</td> <td>1</td> </tr>
\t \t <tr><td>8</td> <td>1</td> <td>1</td> </tr>
\t \t <tr><td>9</td> <td>1</td> <td>1</td> </tr>
\t \t <tr><td>10</td> <td>1</td> <td>1</td> </tr>
\t \t <tr><td>11</td> <td>1</td> <td>1</td> </tr>
\t \t <tr><td>12</td> <td>1</td> <td>1</td> </tr>
\t \t <tr><td>13</td> <td>1</td> <td>1</td> </tr>
\t \t <tr><td>14</td> <td>1</td> <td>1</td> </tr>
\t \t <tr><td>15</td> <td>1</td> <td>1</td> </tr>
\t \t <tr><td>16</td> <td>1</td> <td>1</td> </tr>
\t \t <tr><td>17</td> <td>1</td> <td>1</td> </tr>
\t \t <tr><td>18</td> <td>1</td> <td>1</td> </tr>
\t \t <tr><td>19</td> <td>1</td> <td>1</td> </tr>
\t \t <tr><td>20</td> <td>1</td> <td>1</td> </tr>
\t \t <tr><td>21</td> <td>1</td> <td>1</td> </tr>
\t \t <tr><td>22</td> <td>1</td> <td>1</td> </tr>
\t \t <tr><td>23</td> <td>1</td> <td>1</td> </tr>
\t \t <tr><td>24</td> <td>1</td> <td>1</td> </tr>
\t \t <tr><td>25</td> <td>1</td> <td>1</td> </tr>
\t \t <tr><td>26</td> <td>1</td> <td>1</td> </tr>
\t \t <tr><td>27</td> <td>1</td> <td>1</td> </tr>
\t \t <tr><td>28</td> <td>1</td> <td>1</td> </tr>
\t \t <tr><td>29</td> <td>1</td> <td>1</td> </tr>
\t \t <tr><td>30</td> <td>1</td> <td>1</td> </tr>
\t \t <tr><td>31</td> <td>1</td> <td>1</td> </tr>
\t \t <tr><td>32</td> <td>1</td> <td>1</td> </tr>
\t </tbody>
</table>
<div id="appendTable"></div>
</div>
</body>
</html>
あなたは、 "改ページ" を探しています。 – Chris
いいえ私は印刷のためにテーブル行を中断するページを探しています – Luis
ようこそスタックオーバーフロー!私たちはQ&Aサイトであり、雇用者向けサービスではありません。これまでに何を試みたのか、それがうまくいかなかった理由を説明してください。参照:[なぜ誰かが私を助けることができますか?実際の質問ではありませんか?](http://meta.stackoverflow.com/q/284236) –