ตัวอย่าง ต่อไปนี้เป็นโค้ดสำหรับการสั่ง print preview ซึ่งทำงานได้เฉพาะ IE เท่านั้น แต่เราสามารถประยุกต์
เพิ่มเติม ตามตัวอย่างโค้ด ด้านล่าง สำหรับกรณี browser อื่นๆ
โค้ดตัวอย่าง
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 | <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"<head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>print preview</title><?php if($_GET['print_preview']==1){ ?><style type="text/css" media="all">button#printPreview{ display:none; }body{ padding:10px; }</style><?php }else{ ?><style type="text/css" media="print">button#printPreview{ display:none; }</style><?php } ?></head><body><p>ตัวอย่าง ต่อไปนี้เป็นโค้ดสำหรับการสั่ง print preview ซึ่งทำงานได้เฉพาะ IE เท่านั้น แต่เราสามารถประยุกต์<br />เพิ่มเติม ตามตัวอย่างโค้ด ด้านล่าง สำหรับกรณี browser อื่นๆ </p><script type="text/javascript">function printPreview() { if(navigator.appName == "Microsoft Internet Explorer"){ if(!document._wb){ var obj="<object id='_wb' width='0' height='0' "; obj+=" classid='CLSID:8856F961-340A-11D0-A96B-00C04FD705A2'></object>"; document.body.insertAdjacentHTML( "beforeEnd",obj ); } _wb.ExecWB(7,1) }else{ var windowWidth=850; var windowHeight=550; var myleft=(screen.width)?(screen.width-windowWidth)*0.5:100; var mytop=(screen.height)?(screen.height-windowHeight)*0.5:100; var feature='left='+myleft+',top='+eval(mytop-50)+',width='+windowWidth+',height='+windowHeight+','; feature+='menubar=yes,status=no,location=no,toolbar=no,scrollbars=yes'; window.open(window.location+'?print_preview=1','welcome',feature); }}</script><button id="printPreview" onclick="printPreview()">Print Preview</button></body></html> |
ตัวอย่าง
https://www.ninenik.com/demo/print_preview.php
อย่างไรก็ตาม IE ที่มีระบบ security สูงก็อาจไม่สามารถใช้งานได้ ให้ปรับฟังก์ชันเป็น
1 2 3 4 5 6 7 8 9 10 11 12 | <script type="text/javascript">function printPreview() { var windowWidth=850; var windowHeight=550; var myleft=(screen.width)?(screen.width-windowWidth)*0.5:100; var mytop=(screen.height)?(screen.height-windowHeight)*0.5:100; var feature='left='+myleft+',top='+eval(mytop-50)+',width='+windowWidth+',height='+windowHeight+','; feature+='menubar=yes,status=no,location=no,toolbar=no,scrollbars=yes'; window.open(window.location+'?print_preview=1','welcome',feature);}</script> |
เพื่อใฃ้ในรูปแบบธรรมดา และรองรับทุกบราวเซอร์ โดยสามารถกำหนดรูปแบบที่ต้องการแสดงเมื่อทำการพิมพ์
ด้วยการเพิ่ม css style ในส่วนของ โค้ดตามตำแน่งด้านล่าง
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 | <?php if($_GET['print_preview']==1){// กำหนดรูปแบบการพิมพ์กรณี preview popup หน้าใหม่ ?><style type="text/css" media="all">button#printPreview{ display:none; }body{ padding:10px; }</style><?php }else{ // กำหนดรูปแบบการพิมพ์กรณี preview ผ่าน บราวเซอร์ ?><style type="text/css" media="print">button#printPreview{ display:none; }</style><?php } ?> |
