使用window.print()打印局部頁面,ifrme打印ie報錯


問題:

  使用window.print();打印頁面,將不需要的數據隱藏,將需要的數據顯示,打印完成之后將剛才隱藏的數據還原,顯示的數據隱藏,

谷歌瀏覽器、部分ie能一氣呵成,  火狐瀏覽器以及少數ie瀏覽器出現了:執行到window.print();時后面的js還未開始執行,類似與alert的阻塞,要等到用戶點完頁面彈出的打印框才會執行,這樣導致隱藏的數據沒有顯示,顯示的數據沒有隱藏,

解決辦法:

  網上找了很多種方法,

  https://segmentfault.com/a/1190000006236133

  這個鏈接里有寫使用ifrme作為打印的頁面

<table align="center" class="ml70">
        <tbody>
            <tr>
                <td colspan="8">
                    <div align="center">
                        <b><span >不打印的內容部分//////////////////////</span></b></div>
                    <div>
            </tr>
        </tbody>
    </table>
    <a href="#" onclick="javascript:history.back(1); event.returnValue=false">
        << 返回</a><br />
            <!--startprint-->
            <br />
            <table align="center" class="ml70">
                <tbody>
                    <tr>
                        <td colspan="8">
                            <div align="center">
                                <b><span >//////////////////////要打印的內容部分//////////////////////</span></b></div>
                            <div>
                    </tr>
                </tbody>
            </table>
            <!--endprint-->
            <input type="button" value="打印" onClick="printPage()" />

            <iframe id="printf" src="" width="0" height="0" frameborder="0"></iframe>

 

<script type="text/javascript">  
        function printPage() {  
            //獲取當前頁的html代碼  
            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();
        }  
    </script>

  但是使用這個方法,在ie瀏覽器下, f.contentWindow.print();打印的是iframe的父頁面,

如何解決ie中iframe的打印呢, 繼續找!

https://yq.aliyun.com/ziliao/69150

ie情況下  printf 為打印的iframe的id

window.frames['printf'].focus(); 
window.frames[
'printf'].print();

  但是使用這個方法在火狐瀏覽器中直接保錯

  window.frames['printf'].print();

 

綜合上面兩種方法,進行了一個合並

var f = document.getElementById('printf'); 
  f.contentDocument.write(printhtml);
  f.contentDocument.close();
window.frames['printf'].focus(); 
try{
  window.frames['printf'].print();  
}catch{
        f.contentWindow.print();
}

解決!

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM