如何在asp.net mvc4中使用javascript或jquery獲取HTML div的打印

Question

我在asp.net mvc4中嘗試了以下代碼。 我在打印窗口中沒有div內容。 相同的以下代碼在Asp.net網絡表單中也能很好地工作。 請幫助我解決此問題。

function PrintDivContent(divId) {
            try {
                var rptHeader = document.getElementById(divId).innerHTML;
                var pp = window.open("", "", "height=400,width=800");             
                pp.document.write("<html><head><title></title><script type='text/javascript' src='~/Content/JavaScript1.js'/><style> .table{margin-left: auto;margin-right: auto;border-collapse: collapse;table-layout:fixed;margin-bottom: 40px;}.header{background-color: gray;font-weight: bold;color: #fff;}.table th, .table td{border: 1px solid black;padding: 5px;text-align:center}/*.table tbody tr:last-child{font-weight: 700;}*/.table tbody tr:nth-child(2){background-color: #6545E2;color: white;}h2 {text-align:center;}.td50 ,.td75,.td100{color:black;}</style></head><body>");
                pp.document.write(rptHeader);
                //var printContent = document.getElementById(divId);
                //var WinPrint = window.open('', '', 'left=0,top=0,toolbar=0,status=0');

                pp.document.write('</body></html>');
                setTimeout(function () {
                    pp.print();
                    pp.close();
                }, 500);

            }
            catch (err) {
                alert(err.message);
            }



            //return false;
        }

Answer 1

請嘗試下面的javascript函數，該函數需要您要打印的div的ID：

function printReport(divName) {

    var WindowObject = window.open('', 'PrintWindow', 'width=1000,height=650,top=50,left=50,toolbars=no,scrollbars=yes,status=no,resizable=yes');
    WindowObject.document.write
        (
            '<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">' +
            '<html><head><style type="text/css" > ' +
            '.gridViewReport {font-family: Segoe UI, Verdana, Arial, sans-serif; font-size: .9em; font-variant: normal; width : 100%; background-color : #fff;  margin : 5px 0 10px 0; border :thin solid #c1c1c1;  empty-cells:show; }  .gridViewReport th { border :thin solid #c1c1c1;  border-left:none; text-decoration: none;} .gridViewReport td{  border: solid 1px #c1c1c1; min-height: 25px;text-align: left;padding-left: 10px; border-left:none; border-bottom:none; } .gridViewReport .pgrReport { display:none;} .gridViewReport th a{ color: Black; text-decoration: none;}' +
            '.gridView {font-family: Segoe UI, Verdana, Arial, sans-serif; font-size: .9em; font-variant: normal; width : 100%; background-color : #fff;  margin : 5px 0 10px 0; border :thin solid #c1c1c1;  empty-cells:show; }  .gridView th { border :thin solid #c1c1c1;  border-left:none; text-decoration: none;} .gridView td{  border: solid 1px #c1c1c1; min-height: 25px;text-align: left;padding-left: 10px; border-left:none; border-bottom:none; } .gridView .pgr { display:none;} .gridView th a{ color: Black; text-decoration: none;} .gridView .grdChkBx{display:none;}' +
            '</style>' +
            '</head><body> <div  style="  font-family: Segoe UI, Verdana, Arial, sans-serif;font-variant: normal">' + $('#' + divName).html() +
            '</div></body></html>'
        );
    WindowObject.document.close();
    WindowObject.focus();
    WindowObject.print();
    WindowObject.close();
}

您可以刪除不需要的CSS代碼。

如何在asp.net mvc4中使用javascript或jquery獲取HTML div的打印

問題描述

1 個解決方案

解決方案1
0 已采納 2016-06-23 11:53:50

如何在asp.net mvc4中使用javascript或jquery獲取HTML div的打印

問題描述

1 個解決方案

解決方案1 0 已采納 2016-06-23 11:53:50

解決方案1
0 已采納 2016-06-23 11:53:50