將2 div附加到一個中以使用javascript打印它們

Question

我有這段代碼可以幫助我打印div：

 function printData()
{
   var divToPrint=document.getElementById("section2");
   newWin= window.open("");
   newWin.document.write(divToPrint.outerHTML);




    var css = "table, td, th { \n"+
"    border: 1px solid black; \n"+
"    txt-align:justify; \n"+
"} \n"+
"th {  \n"+
"    background-color: #7a7878; \n"+
"    text-align:center; \n"+
"}";
   var div = $("<div />", {
    html: '&shy;<style>' + css + '</style>'
  }).appendTo( newWin.document.body);
  //newWin.document.createStyleSheet('http:127.0.0.1/clinic form/table.css');

   newWin.print();


   newWin.close();
}

$('button').on('click',function(){
            $("th").css("background-color", "red");
//$("th:contains('Exceeds')").addClass('table');
printData();
});


$('button').on('click',function(){
printData();
})// JavaScript Document

我想將2 div連接成一個，然后打印它們，我試圖添加以下代碼：

var content1 = document.getElementById('section2').innerHTML;
var content2 = document.getElementById('header').innerHTML;

// create our new div, pop the content in it, and give it an id
var combined = document.createElement('div');
combined.innerHTML = content1 + " " + content2; // a little spacing
combined.id = 'new';
document.getElementById('container').appendChild(combined);

這是我的html代碼：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>print page</title>
<link rel="stylesheet" href="../include/stat.css" type="text/css">
<script type="text/javascript" src="/clinic form/include/jquery.min.js"></script>
<script type="application/javascript" src="../include/printing.js"></script>
</head>
<body>
<div id="container">
<div id="header"> <a href="../projDetails.php?id=<?php echo $id ?>"><img src="../images/logo.jpg"></a> </div>
<center>
  <a href="../logout.php">Logout</a>
<br /> <br />
<form action="" method="post" name="daily_report">
<input type="date" name="Date"/>
<input type="submit" name="submitDate" value="Generate Report" />
</form>
<?php
...
?>
<div id="section2" align="center">
<table border="1" cellpadding="2" cellspacing="1" align="center" dir="rtl">
<tr>
...

但我收到以下錯誤：

未捕獲的TypeError：無法讀取null的屬性'appendChild'

編輯：現在我沒有任何錯誤，但仍然無法結合使用2來打印它們，而且我在頁面底部找到了頁面的鏈接，我需要從打印紙中取出

Answer 1

回復您的編輯：

我假設您使用的是Google Chrome瀏覽器來打印頁面。 當您按Ctrl + P時，您會在左側看到打印預覽和一系列選項。 如果按“ +”按鈕，則會看到更多選項。 那里有一個“頁眉和頁腳”選項。 刪除該選項中的對勾，您應該可以在沒有底部URL的情況下打印頁面。

希望能幫助到你。

Answer 2

您可以嘗試如下操作：

var content1 = document.getElementById('section2').innerHTML;
var content2 = document.getElementById('header').innerHTML;

// create our new div, pop the content in it, and give it an id
var combined = document.createElement('div');
combined.innerHTML = content1 + " " + content2; // a little spacing
combined.id = 'new';
newWin= window.open("");
newWin.document.write(combined.outerHTML);

編輯：在您的原始代碼中，您正在使用newin=window.open("")打開一個新窗口， newin=window.open("")不是在其中寫入要復制的div副本，然后將新窗口發送給打印機。 因此，只需組合您要打印的div並將其傳遞給newin.document.write即可在打印前將兩個div都寫入新窗口中

將2 div附加到一個中以使用javascript打印它們

問題描述

2 個解決方案

解決方案1
2 2015-11-30 12:05:48

解決方案2
1 已采納 2015-11-30 11:48:51

將2 div附加到一個中以使用javascript打印它們

問題描述

2 個解決方案

解決方案1 2 2015-11-30 12:05:48

解決方案2 1 已采納 2015-11-30 11:48:51

解決方案1
2 2015-11-30 12:05:48

解決方案2
1 已采納 2015-11-30 11:48:51