美文网首页
H5打印预览功能

H5打印预览功能

作者: 90后的晨仔 | 来源:发表于2017-05-18 23:24 被阅读1690次
    参考链接:http://www.cnblogs.com/wuhuacong/archive/2016/01/21/5147368.html
    

    html文件中代码如下:

     <!--startprint-->
       <div id="printId">
           <img id="printImg" style="height: 297mm;width: 210mm;">
        </div>
        <!--endprint-->
        <iframe id="printf" src="" width="0" height="0" frameborder="0"></iframe>
    

    js文件中代码如下:

     document.getElementById("printImg").src = _imgdates
    var bodyhtml = window.document.body.innerHTML;
    //设置打印开始区域、结束区域
    var startFlag = "<!--startprint-->";
    var endFlag = "<!--endprint-->";
    // 要打印的部分
    var printhtml =bodyhtml.substring(bodyhtml.indexOf(startFlag),bodyhtml.indexOf(endFlag));
    // 生成并打印ifrme
    var f = document.getElementById("printf");                      f.contentDocument.write(printhtml);
    f.contentDocument.close();
    f.contentWindow.print();                
                            
    

    相关文章

      网友评论

          本文标题:H5打印预览功能

          本文链接:https://www.haomeiwen.com/subject/znantxtx.html