印刷htmlページ内のフォーム要素

Webページには<form>があり、印刷のためにプリンタに送信する必要があります。キーボードCmd + P私が望んでいないページ全体が印刷されます。印刷htmlページ内のフォーム要素

フッタのボタンにイベントを配線しましたが、formコンテンツのみをプリンタに送信する方法がわかりません。どのようなアイデア？

$('form').get(0).innerHTML

2016-08-12 Fred J.

は、印刷用CSSファイルと非表示を書きますあなたが表示したくないもの – datafunk

これを見てくださいhttp://stackoverflow.com/questions/12997123/print-specific-part-of-webpage – Manish

あなたはブロックのようなページからその要素を取得し、それを

<div class="print" onclick="PrintElem('#idFromPage')">

そして、あなたが必要なブロックを印刷するためのJSコードを印刷するようにJavascriptを使用することができます。

function PrintElem(elem) { 
    Popup($("body").html(), elem); 
} 

function Popup(data, elem) { 
    var mywindow = window.open('', 'Page to Print', 'height=600,width=800'); 
    mywindow.document.write('<html><head><title>Print Document</title>'); 
    mywindow.document.write('<style> body * { visibility: hidden; } .mobile-view {displa:none;} body, html { background:#fff !important;} #' + elem + ', #' + elem + ' * {visibility: visible; } </style>'); 
    mywindow.document.write('</head><body>'); 
    mywindow.document.write(data); 
    mywindow.document.write('</body></html>'); 

    mywindow.document.close(); // necessary for IE >= 10 
    mywindow.focus(); // necessary for IE >= 10 

    $(mywindow).on('load', function() { 
     mywindow.print(); 
    }); 

    return true; 
}

出典

2016-08-12 12:31:11

これは簡単にmedia queriesを使用して行うことができます。 IE9以上、Chrome、FFなどで動作します。IE8では、ポリフィルを使用できます。

印刷するときに要素を非表示にするだけで済みます。あなたのCSS

@media print { 
    #element-to-hide { 
     display: none; 
    } 
}

これは完全に印刷中の不要な要素を非表示になるには、このような何かを書きます。

出典

2016-08-12 12:25:22 Bikas

イベントはこれがうまくいくと思っていましたが、 to-hideは、1ページを使用すると予想されるフォームのコンテンツであり、それはまだプリンターで2ページを取り、それが自分のページであるかのように、1ページのみを印刷します。 –

可視要素の幅、高さなどを再調整することもできます。こうすることで、印刷中に空白がなくなります – Bikas

印刷htmlページ内のフォーム要素

答えて

関連する問題