文章頁面 如何調取印表機 HTML+
阿新 • • 發佈:2018-11-03
javaScript 核心程式碼
<script > function printPartOfDocument() { this.init.apply(this, arguments) } printPartOfDocument.prototype = { init: function(o, part) { this.o = this.getId(o); this.part = this.getId(part); this.frame = ''; this.printCss = ''; var _this = this; this.addEvent(this.o, 'click', function() { _this.create() }); }, create: function() { var _this = this; if (!this.frame) { var oFrame = document.createElement('iframe'); oFrame.setAttribute('id', 'printIframe'); oFrame.style.position = 'absolute'; oFrame.style.left = '-9999px'; document.body.appendChild(oFrame); } if (!this.printCss) this.printCss = this.getPrintCss(); setTimeout(function() { _this.frame = document.getElementById('printIframe'), d = _this.frame.contentWindow.document, h = d.getElementsByTagName('head')[0], b = d.getElementsByTagName('body')[0]; for (var i = 0; i < _this.printCss.length; i++) { h.appendChild(_this.printCss[i]); } b.innerHTML = ''; b.appendChild(_this.part.cloneNode(true)); _this.frame.contentWindow.print(); }, 0); }, getPrintCss: function() { var styles = document.getElementsByTagName('head')[0].getElementsByTagName('link'), printCss = []; for (var i = 0; i < styles.length; i++) { var attr = styles[i].getAttribute('media'); if (attr == 'all' || attr == 'print') printCss.push(styles[i].cloneNode(true)); } return printCss; }, getId: function(el) { return typeof el == 'string' ? document.getElementById(el) : el }, addEvent: function(o, type, fn) { if (o.addEventListener) { o.addEventListener(type, fn, false) } else if (o.attachEvent) { o.attachEvent('on' + type, function() { fn.call(o, window.event) }) } } } </script>
HTML頁面呼叫
<section class="mail-list"> <div class="wrapper" style="padding-top: 0px;"> <!-- 主題內容 --> <div class="row"> <div class="col-lg-12" id="print_content"> 內容.............. </div> </div> </div> </section> <script> new printPartOfDocument('print','print_content'); // html標籤的id="print_content" </script>