<!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta http-equiv="X-UA-Compatible" content="ie=edge" /> <title>Document</title> <link rel="stylesheet" type="text/css" href="lib/layui/css/layui.css"/> <script src="lib/layui/layui.js" type="text/javascript" charset="utf-8"></script> <script language="javascript"> function preview(oper) { if (oper < 10){ bdhtml=window.document.body.innerHTML;//獲取當前頁的html代碼 sprnstr="<!--startprint"+oper+"-->";//設置打印開始區域 eprnstr="<!--endprint"+oper+"-->";//設置打印結束區域 prnhtml=bdhtml.substring(bdhtml.indexOf(sprnstr)+18); //從開始代碼向后取html prnhtml=prnhtml.substring(0,prnhtml.indexOf(eprnstr));//從結束代碼向前取html window.document.body.innerHTML=prnhtml; window.print(); window.document.body.innerHTML=bdhtml; } else { window.print(); } } </script> <!--打印--> </head> <body> <style type="text/css"> .layui-tab-item{ margin-top: 100px; } .layui-this{ background-color: orange; } </style> <div class="layui-tab"> <ul class="layui-tab-title"> <li class="layui-this"> <table border="1" align="center" id="informationtable"> <tr> <th>年齡1</th> <th>身高</th> <th>體重</th> <th>疾病史</th> </tr> <tr> <td>61歲 </td> <td>161cm</td> <td>61kg</td> <td>高血壓、糖尿病</td> </tr> </table> </li> <!--標簽1--> <li> <table border="1" align="center" id="informationtable"> <tr> <th>年齡2</th> <th>身高</th> <th>體重</th> <th>疾病史</th> </tr> <tr> <td>61歲 </td> <td>161cm</td> <td>61kg</td> <td>高血壓、糖尿病</td> </tr> </table> </li> <!--標簽2--> <li> <table border="1" align="center" id="informationtable"> <tr> <th>年齡2</th> <th>身高</th> <th>體重</th> <th>疾病史</th> </tr> <tr> <td>61歲 </td> <td>161cm</td> <td>61kg</td> <td>高血壓、糖尿病</td> </tr> </table> </li> <!--標簽3--> <li> <table border="1" align="center" id="informationtable"> <tr> <th>年齡2</th> <th>身高</th> <th>體重</th> <th>疾病史</th> </tr> <tr> <td>61歲 </td> <td>161cm</td> <td>61kg</td> <td>高血壓、糖尿病</td> </tr> </table> </li> <li> <!--標簽4--> <table border="1" align="center" id="informationtable"> <tr> <th>年齡2</th> <th>身高</th> <th>體重</th> <th>疾病史</th> </tr> <tr> <td>61歲 </td> <td>161cm</td> <td>61kg</td> <td>高血壓、糖尿病</td> </tr> </table> </li> <!--標簽5--> </ul> <!--startprint1--> <!--打印內容開始--> <div class="layui-tab-content"> <div class="layui-tab-item layui-show"> <table border="1" align="center" id="informationtable"> <tr> <th>年齡1</th> <th>身高</th> <th>體重</th> <th>疾病史</th> </tr> <tr> <td>61歲 </td> <td>161cm</td> <td>61kg</td> <td>高血壓、糖尿病</td> </tr> </table> </div> <!--對應1--> <div class="layui-tab-item"><table border="1" align="center" id="informationtable"> <tr> <th>年齡2</th> <th>身高</th> <th>體重</th> <th>疾病史</th> </tr> <tr> <td>61歲 </td> <td>161cm</td> <td>61kg</td> <td>高血壓、糖尿病</td> </tr> </table></div> <!--對應2--> <div class="layui-tab-item"><table border="1" align="center" id="informationtable"> <tr> <th>年齡3</th> <th>身高</th> <th>體重</th> <th>疾病史</th> </tr> <tr> <td>61歲 </td> <td>161cm</td> <td>61kg</td> <td>高血壓、糖尿病</td> </tr> </table></div> <!--對應3--> <div class="layui-tab-item"><table border="1" align="center" id="informationtable"> <tr> <th>年齡4</th> <th>身高</th> <th>體重</th> <th>疾病史</th> </tr> <tr> <td>61歲 </td> <td>161cm</td> <td>61kg</td> <td>高血壓、糖尿病</td> </tr> </table></div> <!--對應4--> <div class="layui-tab-item"><table border="1" align="center" id="informationtable"> <tr> <th>年齡5</th> <th>身高</th> <th>體重</th> <th>疾病史</th> </tr> <tr> <td>61歲 </td> <td>161cm</td> <td>61kg</td> <td>高血壓、糖尿病</td> </tr> </table></div> <!--對應5--> </div> <!--打印內容結束--> <!--endprint1--> </div> <div class="layui-inline" title="打印" onclick=preview(1) ><i class="layui-icon layui-icon-face-smile" style="font-size: 30px; color: #1E9FFF;"></i></div> <!-- <input type=button name='button_export' title='打印' onclick=preview(1) value=打印1>--> <script> layui.use('element', function(){ var element = layui.element; }); </script> </body> </html>