A. js實現的將html轉為pdf功能【基於瀏覽器端插件jsPDF】
本文實例講述了JS實現的將html轉為pdf功能。分享給大家供大家參考，具體如下：
<!DOCTYPE
html>
<html>
<head>
<title>jsPDF插件</title>
<meta
http-equiv="Content-Type"
content="text/html;
charset=utf-8">
<script
src="https://code.jquery.com/jquery-git.js"></script>
<script
src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/0.4.1/html2canvas.js"></script>
<script
src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.0.272/jspdf.debug.js"></script>
</head>
<body>
<p
class="pdf-wrapper"
="to-pdf">HTML
content...<h1>中文</h1>
中國,漢字,測試:合同
模版
中國中國中國中國中國中國中國中國中國中國中國中國中國中國中國中國中國中國中國中國中國中國中國中國中國中國中國中國中國中國中國中國中國中國中國中國中國中國中國中國中國中國中國中國中國中國中國</br>中國中國中國中國中國中國中國中國中國中國中國中國中國中國中國中國中國中國中國中國中國中國中國中國中國中國中國中國中國中國中國中國中國中國中國中國中國中國....................<br/>
中國,漢字,測試:合同
模版
...................<br/>
計費
介面
....................<br/>
<img
src='http://www.jb51.net/images/logo.gif'/>
</p>
<script
type="text/javascript">
var
pdf
=
new
jsPDF('p','pt','a4');
pdf.internal.scaleFactor
=
1;
var
options
=
{
pagesplit:
true
};
//$('.pdf-wrapper')
pdf.addHTML(document.body,options,function()
{
pdf.save('web1111.pdf');
});
</script>
</body>
</html>
運行效果：
更多關於JavaScript相關內容可查看本站專題：《JavaScript擴展技巧總結》、《JavaScript常用函數技巧匯總》、《javascript面向對象入門教程》、《JavaScript中json操作技巧總結》、《JavaScript切換特效與技巧總結》、《JavaScript查找演算法技巧總結》、《JavaScript錯誤與調試技巧總結》、《JavaScript數據結構與演算法技巧總結》、《JavaScript遍歷演算法與技巧總結》及《JavaScript數學運算用法總結》
希望本文所述對大家JavaScript程序設計有所幫助。
您可能感興趣的文章:jsPDF導出pdf示例jsPDF生成pdf後在網頁展示實例使用jspdf生成pdf報表phonegap教程使用jspdf庫在應用中生成pdf文件(pdf生成方法)JS導出PDF插件的方法(支持中文、圖片使用路徑)js插件方式打開pdf文件(瀏覽器pdf插件分享)用Javascript檢查Adobe
PDF插件是否安裝的實現代碼純js實現html轉pdf的簡單實例(推薦)基於Phantomjs生成PDF的實現方法JavaScript+Java實現HTML頁面轉為PDF文件保存的方法JavaScript代碼生成PDF文件的方法
B. 如何用 js 實現在網頁里點擊按鈕 把網頁內容另存為pdf格式
直接用js是實現不了的，可以用js調用列印的功能，然後客戶端安裝了pdf列印（另存pdf）.這個由客戶端決定，做網站的人決定不了。
C. 將網頁內容轉化為PDF的三種方法
大家知道，有一些網頁是有時間限制的，過段時間就找不到它們的鏈接了。這時候如果想把它們存下來那麼可以使用PDF的功能，把它們存成文檔，以備後來的察看。我在下面根據大家系統軟體版本的情況，以及各自的使用習慣，給出三種簡單的 方法 ，有需要的朋友可以來看看哦。
將網頁內容轉化為PDF方法一：word實現法
1這里推薦使用的word版本為word2007或者2010版本。word2003的效果可能跟原來的網頁會有差別
2首先，我們拖拽滑鼠，選擇網頁中我能需要保存成文檔的內容。右擊選擇復制
3打開一個新建的word文檔命名為「網路一下，你就知道」。右擊滑鼠，選擇保留原格式粘貼
4點擊保存按鈕。點擊文件，列印。在列印機位置選擇PDF。點擊列印
5在新彈出頁面選擇保存路徑，點擊保存即可
6當然，除了第四個步驟這種方法以外，我們也可以右擊word文檔，選擇轉化為PDF。我們下了來講第二種方法
將網頁內容轉化為PDF方法二：網頁轉化法
1在打開的網頁中，一次點擊文件，另存為。總之找到可以保存網頁的命令按鈕，點擊保存網頁
2在彈出保存菜單中選擇保存類型為「網頁，僅HTML」選項，點擊保存。
3好了，現在找到我們的網頁文件，右擊選擇轉化為Adobe PDF 即可。O(∩_∩)O哈哈~
將網頁內容轉化為PDF方法三：直接PDF法
如果你現在打開的網頁不是使用IE瀏覽器的話，復制網頁地址到IE瀏覽器打開。我們以網路首頁為例
由於現在的IE製作的比較簡約，一些工具比如PDF我們都看不到它們了。所以在窗口最上方的空白處右擊，把PDF按鈕調出來
然後在彈出的窗口IE會問是否允許載入，點擊啟用
然後我們發現在瀏覽器右上角出現了兩個PDF按鈕圖標
點擊轉換按鈕，馬上我們的頁面就轉化為PDF格式文檔可以保存了。如果點擊【選擇】按鈕的話，我們需要拖拽滑鼠選擇需要轉化的對象或元素，再點擊轉換按鈕完成轉換
來看看我們最後轉化完成的文檔。後一個圖是PDF文檔的效果
將網頁內容轉化為PDF的三種方法相關 文章 ：
★ 怎麼在網頁上將word轉成pdf
★ 電腦如何將網頁保存為PDF格式
★ word2010轉為pdf的兩種方法
★ 將word2003轉換成pdf格式的方法步驟圖
★ 將word轉成pdf的兩種方法
★ 360瀏覽器列印網頁輸出為pdf文件怎麼設置
★ 在線將word轉化為pdf的兩種方法
★ word轉成pdf的兩種方法
★ word2010中如何轉換pdf
var _hmt = _hmt || []; (function() { var hm = document.createElement("script"); hm.src = "https://hm..com/hm.js?"; var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(hm, s); })();D. js將網頁導出成pdf（js 列印指定div內容）2020-09-02
<input type="button"叢困 id="button" value="點擊列印"/>
<div id="div_print">
<滲爛念p>列印此處內容</p>
</div>
<script type="text/javascript">
function printdiv(printpage){
var newstr=document.getElementById(printpage).innerHTML;
var oldstr=document.body.innerHTML;
document.body.innerHTML=newstr;
window.print();
document.body.innerHTML=oldstr;
return false;
}
window.onload=function(){
var bt=document.getElementById("button");
bt.onclick=function(){printdiv('div_print');}
}
</script>
html, body{
overflow:visible;
}
列印歷弊時另存為pdf模式列印後的內容可復制 默認為Microsoft Print to PDF 模式
E. nodejs讀取pdf並翻轉內容保存pdf
nodejs讀取pdf並翻轉內容保存pdf需以下幾個步驟。
1、啟動windows命令行工具（windows下啟動系統搜索功能，輸入cmd回車就出來了）。
2、查看環境變數是否已經自動配置，在命令行工具中輸入node-v，如果出現v10欄位，則說明成功安裝Node.js。
3、在第三步發現輸入node-v還是沒有出現對應的欄位，那麼重啟電腦即可。
4、打開本項目文件夾，打開命令行工具（windows系統中直接在文件的url地址欄輸入cmd就可以打開了），輸入npmicnpmnodemon-g。
5、下載puppeteer爬蟲包，在完成第五步後，使用cnpmipuppeteer--save命令下載。
6、完成第六步下載後，打開本項目的url.js，將您需要爬蟲爬取的網頁地址替換上去。
7、在命令行中輸入nodemonindex.js即可爬取對應的內容，並且自動輸出到當前文件夾下面的index.pdf文件中。
F. javascript 列印網頁成pdf文件
通過javascript實現PDF自動列印(2009-05-08 15:06:05)
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
string pdffile = createpdf(false);
iframe1.Attributes.Add("src", pdffile);
}
}
private string createpdf(bool print)
{
try
{
string filename = "Chap0106.pdf";
iTextSharp.text.Document doc = new iTextSharp.text.Document();
PdfWriter writer = iTextSharp.text.pdf.PdfWriter.getInstance(doc, new FileStream(Server.MapPath(filename), FileMode.OpenOrCreate));
doc.Open();
doc.Add(new Paragraph(6, "abcd"));
writer.setViewerPreferences(PdfWriter.HideMenubar | PdfWriter.HideToolbar);
if (print)
{
PdfAction.javaScript("myOnMessage();", writer);
writer.addJavaScript("this.print(true);function myOnMessage(aMessage) {app.alert('Test',2);} var msgHandlerObject = new Object();doc.onWillPrint = myOnMessage;this.hostContainer.messageHandler = msgHandlerObject;");
}
doc.Close();
return filename;
}
catch
{
return "";
}
}
protected void Button1_Click(object sender, EventArgs e)
{
string pdffile = createpdf(true);
iframe1.Attributes.Add("src", pdffile);
}
如題：
<body>
<object classid="clsid:CA8A9780-280D-11CF-A24D-444553540000" name="PDF1" width="760" height="633" border="0">
<param name="SRC" value="01.pdf"/>
</object>
<script language="JavaScript" type="text/javascript">
PDF1.SetShowToolbar(false);
</script>
</body>
在 pdf 文件里加上這樣的屬性就可以了
如何也通過類似「PDF1.SetShowToolbar(false); 」控制實現禁止對pdf內容的復制、以及列印！！！謝謝
javascript實現PDF自動列印
網頁顯示pdf文件，禁止保存和列印
1. 用網頁打開 PDF文件。
2. 只可以瀏覽但是不許列印保存。
結果參照頂樓在jsf里實現如下代碼：
//Get response
FacesContext faces = javax.faces.context.FacesContext.getCurrentInstance();
HttpServletResponse response = (HttpServletResponse) faces.getExternalContext().getResponse();
//打開源pdf文件
PdfReader reader = new PdfReader("./HelloWorld.pdf");
Document document = new Document(reader.getPageSizeWithRotation(1));
int n = reader.getNumberOfPages();
ByteArrayOutputStream baos = new ByteArrayOutputStream();
//將原pdf文件中的內容放入位元組流baos中
PdfCopy = new PdfCopy(document, baos);
//隱藏工具欄並給pdf加密
.setViewerPreferences(PdfWriter.HideMenubar | PdfWriter.HideToolbar);
.setEncryption(false, null, "pdf", PdfWriter.AllowAssembly);
//往pdf中寫入內容
document.open();
for(int i = 1; i <= n; i++) {
PdfImportedPage page = .getImportedPage(reader, i);
.addPage(page);
}
document.close();
//設置響應類型並將pdf流寫入響應
response.setContentType("application/pdf");
response.setContentLength(baos.size());
response.setHeader("Expires", "0");
response.setHeader("Cache-Control",
"must-revalidate, post-check=0, pre-check=0");
response.setHeader("Pragma", "public");
ServletOutputStream out = response.getOutputStream();
//將位元組流baos中的內容寫入響應流
baos.writeTo(out);
out.flush();
faces.responseComplete();
復制代碼
以上代碼的缺點：
1:加密只能實現列印和修改加密。
2:雖然隱藏了工具欄，但是可以通過快捷鍵F8來將工具欄顯示出來
3:IE菜單欄中自帶的保存功能也能將此pdf保存到本地
4:在客戶端沒有安裝pdf閱讀器的情況下，瀏覽器會直接提示用戶是否下載，這也是和需求不符的。
最後經過不懈努力，找到了一個用<object></object>曲線救國的路線，哈哈，先來看看如下代碼：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
</head>
<body>
<tr><td>
<p style="margin-top:-45px;margin-bottom:0px;">
<object classid="clsid:CA8A9780-280D-11CF-A24D-444553540000" id="Pdf1" width="100%" height="100%">
<param name="_Version" value="327680">
<param name="_ExtentX" value="2646">
<param name="_ExtentY" value="1323">
<param name="_StockProps" value="0">
<param name="SRC" value="C:\temp.pdf">
</object>
</p>
</td></tr>
</body>
</html>
復制代碼
其中sytle的是用一種比較bt的辦法影藏了pdf頂部的工具欄（可以用第一種方法，這個方法作為備用）。
這樣即使用ie菜單欄中的保存功能也只是保存網頁布局而不會把pdf保存下來。
另外這樣即使本地沒裝pdf閱讀器也不會讓你下載該pdf了，而只是在相應位置出現叉叉而已。基本能夠滿足客戶的需求了
G. 如何用js生成pdf
1，生成 PDF 這種事情通常由伺服器端做
2，瀏覽器做的話要依賴於插件（ActiveX/Plugin，通常購買第三方的）
3，瀏覽器預覽、列印倒是沒問題（要裝 PDF viewer，Firefox 自帶的 PDF.js 擴展也可以）
4，總結，AngularJS 是瀏覽器端的，干不來這事兒，也不應該干這事兒，我想你最好換個方向
H. 如何利用js或php將html網頁轉為pdf
php方法：
首先下載一個TCPDF插件。（直接網路「tcpdf」，官網貌似沒法訪問了，下面有個sourceforge的可以使用）
然後通過以下步驟即可完成：
1、require_once導入tcpdf.php文件及相關配置信息；
2、實例化TCPDF；
3、設置PDF文檔的格式，包括文檔信息、頁眉、頁尾、字體、外間距、圖片邊框、分頁等；
4、導入PDF文檔的內容，可以是單行或多行簡單字元串，也可以HTML格式的字元串等；
5、輸出PDF文檔。
以下是demo：
require_once('tcpdf.php');
//實例化
$pdf = new TCPDF('P', 'mm', 'A4', true, 'UTF-8', false);
// 設置文檔信息
$pdf->SetCreator('BaiDuZhiDao'); //創建者
$pdf->SetAuthor('AldenC'); //作者
$pdf->SetTitle('Hello World!'); //標題
$pdf->SetSubject('TCPDF Tutorial'); //set subject
$pdf->SetKeywords('TCPDF, PDF, PHP'); //關鍵詞
// 設置頁眉和頁腳信息
$pdf->SetHeaderData('logo.png', 30, '.com', 'html轉pdf範例',
array(0,64,255), array(0,64,128));
$pdf->setFooterData(array(0,64,0), array(0,64,128));
// 設置頁眉和頁腳字體
$pdf->setHeaderFont(Array('stsongstdlight', '', '10'));
$pdf->setFooterFont(Array('helvetica', '', '8'));
// 設置默認等寬字體
$pdf->SetDefaultMonospacedFont('courier');
// 設置間距
$pdf->SetMargins(15, 27, 15);
$pdf->SetHeaderMargin(5);
$pdf->SetFooterMargin(10);
// 設置分頁
$pdf->SetAutoPageBreak(TRUE, 25);
// set image scale factor
$pdf->setImageScale(1.25);
// set default font subsetting mode
$pdf->setFontSubsetting(true);
//設置字體
$pdf->SetFont('stsongstdlight', '', 14);
$pdf->AddPage();
$str1 = 'html轉換成pdf的工具，tcpdf~';
$pdf->Write(0,$str1,'', 0, 'L', true, 0, false, false, 0);
//輸出PDF
$pdf->Output('t.pdf', 'I');
I. jquery列印自動生成pdf
在客戶端扮數判JavaScript生成PDF文件。
創廳改畢隱建您的第一個文檔
看examples/basic.html例子。
1
2
3
var doc = new jsPDF();
doc.text(20, 20, 'Hello world.');
doc.save('Test.pdf');
J. 如何利用js或php將html網頁轉為pdf
首先需要安裝wkhtmltopdf這個軟體 需要執行shell_exec函數的php文件和安裝的wkhtmltopdf.exe可執行文件在同一目錄下，不然專php找不到這個執行文件
shell_exec("wkhtmltopdf.exe --page-size A4 --outline 網頁地址 pdf文件名");
--page-size 以A4紙的尺寸顯示pdf內容
--outline 顯示目錄(網頁中h1,h2來定)
網頁地址 需要轉成pdf的網頁地址
pdf文件名 生成pdf的文屬件名，可以使用絕對路徑