首頁 探索 說明
登入
dingcong
/
everlight.eap
1
0
複刻 0
檔案 問題管理 0 合併請求 0 Wiki
目錄樹: 0ef0c1cc9d
分支列表 標籤列表
everlight.eap
/
backend
/
WebMainFrameForEap
/
wwwroot
/
Lodop6.226_Clodop4.096
/
PrintSample20.html

PrintSample20.html 7.4 KB
文件歷史 原始文件

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102 
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    2. 

  2. <html>
    3. 

  3. <head>
    4. 

  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    5. 

  5. <title>WEB打印控件LODOP的使用样例二十:强制分页打印预览多张卡片</title>
    6. 

  6. 

  7. <script language="javascript" src="LodopFuncs.js"></script>
    8. 

  8. </head>
    9. 

  9. <body>
    10. 

  10. 

  11. <h2><font color="#009999">演示强制分页打印预览多张卡片：</font></h2>
    12. 

  12. 

  13. <p>通常情况下，当对象位置超出纸张高度时，该对象会被自动打印到下一页甚至更下一页，</p>
    14. 

  14. 

  15. <p>但如果纸张高度不确定时，可以用<font color="#0000FF">NewPage</font>函数直接强制在新一页的固定位置输出。</p>
    16. 

  16. 

  17. <h2 align="center"><b>商品清单</b></h2>
    18. 

  18. 

  19. <div id="splist" style="OVERFLOW-Y: scroll; WIDTH: 100%; POSITION: HEIGHT: 200px">
    20. 

  20.   <table class="tableframe2" style="WORD-BREAK: break-all" width="97%" align="center">
    21. 

  21.     <tbody>
    22. 

  22.       <tr id="id1" style="BACKGROUND-COLOR: #dae2ed">
    23. 

  23.         <td  align="center" width="15%" height="25" bgcolor="#C0C0C0">
    24. 

  24.           <p align="center"><b>商品编号</b></p>
    25. 

  25.         </td>
    26. 

  26.         <td  align="center" width="31%" bgcolor="#C0C0C0"><b>商品名称</b></td>
    27. 

  27.         <td  align="center" width="14%" bgcolor="#C0C0C0"><b>数量</b></td>
    28. 

  28.         <td  align="center" width="15%" bgcolor="#C0C0C0"><b>单价(元)</b></td>
    29. 

  29.       </tr>
    30. 

  30.       <tr    style="BACKGROUND-COLOR: #dae2ed">
    31. 

  31.         <td   width="15%" height="25"><input type="text" id="BH1" value="001" style="text-align:center;border:0px;background-color:#dae2ed" readonly=true></td> 
    32. 

  32.         <td  align="center" width="31%"><input type="text" id="MC1" value="商品0A" style="text-align:center;border:0px;background-color:#dae2ed" readonly=true></td>
    33. 

  33.         <td  align="center" width="14%"><input type="text" id="SL1" value="1.00" style="text-align:center;border:0px;background-color:#dae2ed" readonly=true></td>
    34. 

  34.         <td  align="center" width="15%"><input type="text" id="DJ1" value="10.00" style="text-align:center;border:0px;background-color:#dae2ed" readonly=true></td>
    35. 

  35.       </tr>
    36. 

  36.       <tr style="BACKGROUND-COLOR: #dae2ed">
    37. 

  37.         <td   width="15%" height="25"><input type="text" id="BH2" value="002" style="text-align:center;border:0px;background-color:#dae2ed" readonly=true></td> 
    38. 

  38.         <td  align="center" width="31%"><input type="text" id="MC2" value="商品0B" style="text-align:center;border:0px;background-color:#dae2ed" readonly=true></td>
    39. 

  39.         <td  align="center" width="14%"><input type="text" id="SL2" value="1.00" style="text-align:center;border:0px;background-color:#dae2ed" readonly=true></td>
    40. 

  40.         <td  align="center" width="15%"><input type="text" id="DJ2" value="20.00" style="text-align:center;border:0px;background-color:#dae2ed" readonly=true></td>
    41. 

  41.       </tr>  
    42. 

  42.       <tr style="BACKGROUND-COLOR: #dae2ed">
    43. 

  43.         <td   width="15%" height="25"><input type="text"    id="BH3" value="003" style="text-align:center;border:0px;background-color:#dae2ed" readonly=true></td> 
    44. 

  44.         <td  align="center" width="31%"><input type="text"  id="MC3" value="商品0C" style="text-align:center;border:0px;background-color:#dae2ed" readonly=true></td>
    45. 

  45.         <td  align="center" width="14%"><input type="text"  id="SL3" value="1.00" style="text-align:center;border:0px;background-color:#dae2ed" readonly=true></td>
    46. 

  46.         <td  align="center" width="15%"><input type="text"  id="DJ3" value="70.00" style="text-align:center;border:0px;background-color:#dae2ed" readonly=true></td>
    47. 

  47.       </tr>        
    48. 

  48.       <tr style="BACKGROUND-COLOR: #dae2ed">
    49. 

  49.         <td   width="15%" height="25"><input type="text"    id="BH4" value="004" style="text-align:center;border:0px;background-color:#dae2ed" readonly=true></td> 
    50. 

  50.         <td  align="center" width="31%"><input type="text"  id="MC4" value="商品0D" style="text-align:center;border:0px;background-color:#dae2ed" readonly=true></td>
    51. 

  51.         <td  align="center" width="14%"><input type="text"  id="SL4" value="1.00" style="text-align:center;border:0px;background-color:#dae2ed" readonly=true></td>
    52. 

  52.         <td  align="center" width="15%"><input type="text"  id="DJ4" value="25.00" style="text-align:center;border:0px;background-color:#dae2ed" readonly=true></td>
    53. 

  53.       </tr>   
    54. 

  54.       <tr style="BACKGROUND-COLOR: #dae2ed">
    55. 

  55.         <td   width="15%" height="25"><input type="text"    id="BH5" value="005" style="text-align:center;border:0px;background-color:#dae2ed" readonly=true></td> 
    56. 

  56.         <td  align="center" width="31%"><input type="text"  id="MC5" value="商品0E" style="text-align:center;border:0px;background-color:#dae2ed" readonly=true></td>
    57. 

  57.         <td  align="center" width="14%"><input type="text"  id="SL5" value="1.00" style="text-align:center;border:0px;background-color:#dae2ed" readonly=true></td>
    58. 

  58.         <td  align="center" width="15%"><input type="text"  id="DJ5" value="40.00" style="text-align:center;border:0px;background-color:#dae2ed" readonly=true></td>
    59. 

  59.       </tr> 
    60. 

  60.       <tr style="BACKGROUND-COLOR: #dae2ed">
    61. 

  61.         <td   width="15%" height="25"><input type="text"    id="BH6" value="006" style="text-align:center;border:0px;background-color:#dae2ed" readonly=true></td> 
    62. 

  62.         <td  align="center" width="31%"><input type="text"  id="MC6" value="商品0F" style="text-align:center;border:0px;background-color:#dae2ed" readonly=true></td>
    63. 

  63.         <td  align="center" width="14%"><input type="text"  id="SL6" value="1.00" style="text-align:center;border:0px;background-color:#dae2ed" readonly=true></td>
    64. 

  64.         <td  align="center" width="15%"><input type="text"  id="DJ6" value="36.50" style="text-align:center;border:0px;background-color:#dae2ed" readonly=true></td>
    65. 

  65.       </tr>
    66. 

  66.       <tr style="BACKGROUND-COLOR: #dae2ed">
    67. 

  67.         <td   width="15%" height="25"><input type="text"    id="BH7" value="007" style="text-align:center;border:0px;background-color:#dae2ed" readonly=true></td> 
    68. 

  68.         <td  align="center" width="31%"><input type="text"  id="MC7" value="商品0G" style="text-align:center;border:0px;background-color:#dae2ed" readonly=true></td>
    69. 

  69.         <td  align="center" width="14%"><input type="text"  id="SL7" value="1.00" style="text-align:center;border:0px;background-color:#dae2ed" readonly=true></td>
    70. 

  70.         <td  align="center" width="15%"><input type="text"  id="DJ7" value="60.00" style="text-align:center;border:0px;background-color:#dae2ed" readonly=true></td>
    71. 

  71.       </tr> 
    72. 

  72.     </tbody>
    73. 

  73.   </table>
    74. 

  74. </div>
    75. 

  75. <p><font color="#009999" size="3">一次性输出以上全部商品的卡片（一品一页），看看</font> 
    76. 

  76. <font size="2"><input type="button" value="打印预览" onClick="MyPreview()"></font>     
    77. 

  77. </p>
    78. 

  78. <p><a href="PrintSampIndex.html">&lt;&lt;回样例目录</a></p>
    79. 

  79. <script language="javascript" type="text/javascript"> 
    80. 

  80. 	var LODOP; //声明为全局变量
    81. 

  81. 	function MyPreview() {	
    82. 

  82. 		LODOP=getLodop();  
    83. 

  83. 		LODOP.PRINT_INIT("打印控件Lodop功能演示_多页预览");
    84. 

  84. 		LODOP.SET_PRINT_PAGESIZE(1,500,508,"");	
    85. 

  85. 		CreateAllPages();
    86. 

  86. 		LODOP.PREVIEW();
    87. 

  87. 	};
    88. 

  88. 	function CreateAllPages(){	
    89. 

  89. 		for (i = 1; i < 8; i++) {
    90. 

  90. 			LODOP.NewPage();
    91. 

  91. 			LODOP.ADD_PRINT_RECT(10,18,128,160,0,1);		
    92. 

  92. 			LODOP.ADD_PRINT_TEXT(31,33,111,20,"商品编号："+document.getElementById("BH"+i).value);		
    93. 

  93. 			LODOP.ADD_PRINT_TEXT(69,33,111,20,"商品名称："+document.getElementById("MC"+i).value);
    94. 

  94. 			LODOP.ADD_PRINT_TEXT(107,33,111,20,"商品数量："+document.getElementById("SL"+i).value);
    95. 

  95. 			LODOP.ADD_PRINT_TEXT(146,33,111,20,"商品单价："+document.getElementById("DJ"+i).value);			
    96. 

  96. 		}			
    97. 

  97. 		
    98. 

  98. 	};	
    99. 

  99. </script>
    100. 

  100. 

  101. </body>
    102. 

  102. </html>
    103.