1. 程式人生 > >js將html儲存成圖片,pdf

js將html儲存成圖片,pdf

  <script src="${root!}/static/js/html2canvas.js"></script>
     <script src="${root!}/static/js/jspdf.debug.js"></script>

 $(function(){    

        var targetDom = $("#container1");    
        var copyDom = targetDom.clone();    
        copyDom.width(targetDom.width() + "px");    
        copyDom.height(targetDom.height() + "px");    
        $('body').append(copyDom);    
        html2canvas(copyDom, {    
            allowTaint: true,    
            taintTest: false,    
            onrendered : function(canvas) {    
            imgData = canvas.toDataURL(type);    
          }    
        });  
        
    })  
    
    
    
    function exporepng(){
    html2canvas($("#container1"), {  
         onrendered: function(canvas) {
         url = canvas.toDataURL();
           //把擷取到的圖片替換到a標籤的路徑下載  
           $("#download").attr('href',canvas.toDataURL());  
           //下載下來的圖片名字  
           $("#download").attr('download','share.png') ;   
           document.body.appendChild(canvas);  
         }  
       });  
       
       document.getElementById("download").click(); 
    }
    
    
    
    function exporepdf(){
     
    var pdf = new jsPDF('p', 'mm', 'a4'); 
         var print_content = $('#container1'); 
         var filename = 'hello.pdf'; 
         $('#container1').css("background", "#fff");
         pdf.addHTML($('#container1'), function(){
             pdf.output("save", filename)
         });
         $('#container1').css('background','none')


   }

相關推薦

jshtml儲存圖片pdf

  <script src="${root!}/static/js/html2canvas.js"></script>     <script src="${root!}/static/js/jspdf.debug.js"></scr

jshtml生成為圖片儲存在本地

html生成圖片的方式有很多種,有的需要下載安裝外掛,如phantomjs 。顯得未免麻煩了些,有的又是通過後臺來實現的,但個人感覺沒必要做這種互動,也沒必要在服務端生成這些零時檔案,那麼問題來了,有沒有什麼方法,能直接在頁面生成圖片然後儲存在本地呢,答案是肯定的。在這裡我為

瀏覽器外掛形式htmlpdfhtml圖片

javascript: (function () { var head = document.getElementsByTagName('head')[0]; var script = document.createElement('script'); var scrip

html頁面儲存圖片圖片寫入pdf

需求是一個匯出pdf的功能,多方奔走終於實現了,走了不少彎路,而且懷疑現在這個方法仍是彎的。 有個jsPDF 外掛可以在前端直接生成pdf,很簡便,但不支援IE。 前端: 首先引入  html2canvas.js html2canvas(document.body, {  //截圖物件          /

JShtml生成為圖片並下載(適用於大多數瀏覽器包含手機瀏覽器等(需配合後臺處理))(筆記)

(1)html程式碼 <div id="id="content""> //此處放置需要生成圖片的程式碼 <div class="order_payCon"> <div class="submit_pay_success"

怎樣pdf文件轉換圖片pdf圖片的小技巧

選擇 自己的 自動打開 文件 文件夾 ces RoCE 彈出 設置圖 Pdf文件是辦公當中普遍使用得文件格式,該文件格式因自身的優異性得到廣泛使用。可是pdf文件通常需要借助功能才能進行查閱。因此在假期時間,突然需要查看pdf工作文件,可是身邊沒有電腦,手機也無法查看時,就

如何使用jscanvas儲存圖片檔案並且可以自定義檔名

1、從canvas中直接提取圖片元資料 // 圖片匯出為 png 格式 var type = 'png'; var imgData = canvas.toDataURL(type); 上面的程式碼得到的資料格式為:data:image/p

C# HTML 轉換為圖片PDF

ont gif completed 字段 sed pad cli 滾動條 lose 首先是把 HTML 轉換為圖片。 public partial class Form1 : Form { public Form1() {

Web開發之用canvas2image.jscanvas儲存圖片(實現頁面截圖下載功能)

var canvas, ctx, bMouseIsDown = false, iLastX, iLastY, $save, $imgs, $convert, $imgW, $imgH, $sel; function init () {

批量網頁轉換圖片PDF文件技巧分享

工作中我們有時要將一些批量的網頁轉換成圖片或者PDF文件格式,雖然多數瀏覽器具有滾動截圖或者列印輸出PDF文件功能,但是如果有幾十上百張網頁需要處理,那也是要人命的。所以我一直想找一款能夠批量處理該工作的軟體,但基本都是收費的,即便是收費的功能也一般。終於,我找

微信瀏覽器html儲存圖片儲存

需求:將含有二維碼的html轉化成圖片並儲存 思路: 1.將html頁面轉化成圖片需要使用H5中canvas(畫布)功能,需要引入js庫: html2canvas.js canvas2image.js jquery.min.js(必須要) qrcode.min.j

JShtml轉換txt

//將html轉換成txt function css_js_html($str,$encode = 'GB2312'){ $str = preg_replace("/<style .*?<\/style>/is", "", $str); $str

使用 html2cavas js外掛 HTML頁面生成圖片儲存至本地(pc端)

一, 匯入html2canvas.min.js 大家可以去html2canvas官網看看  http://html2canvas.hertzen.com/   二,把html頁面生成base64碼 //把html生成圖片 htmltoimg()

django網路中的圖片儲存model中的ImageField

有這樣的情形,django個人頭像在model中是: class UserProfile(AbstractUser): """ 使用者 """ name = models.CharField(max_length=30, null=True, blank=True

canvas畫布儲存圖片avaScript圖片轉畫布用JavaScript畫布保持圖片格式上傳阿里雲

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style>

PHPHTML轉換各種格式圖片PDF

安裝軟體清單 libwkhtmltox linux下的webkit核心 phpwkhtmltox php擴充套件,可呼叫webkit核心將網頁轉換成各種格式圖片或者pdf font-chinese 中文字型 msyh,Consolas 字型(優雅字型)

Python---對html檔案內容進行搜尋取出特定URL地址字串儲存列表並使用每個url下載圖片儲存到硬碟上使用正則re

Python—對html檔案內容進行搜尋取出特定URL地址字串,儲存成列表,並使用每個url下載圖片,並儲存到硬碟上,正則re 對目標回包內容取出這樣類似的內容: https://xian

Docx4jhtmlword時br標簽為軟回車的問題修改

peek aras -i lin 位置 org pac 回車 tco docx4j版本:3.0.1 修改jar包:docx4j-ImportXHTML maven配置為: 具體代碼位置:\org\docx4j\convert\in\xhtml\XHTMLImporterIm

前端和java後臺HTML轉換pdf

前端和java後臺將HTML轉換成pdf java後臺方式: private final static String DEST = "C:\\80afa41a3bfc474cbf1ac8b5bc1d.pdf"; //生成pdf的路徑 private final

Js動態追加行內容儲存到資料庫並取出資料通過js動態顯示

實現步驟講解: 首先需要在html頁面建立一個table表格和一個動態新增行的按鈕 <input type="button" onclick="addT()" value="新增" /> 然後實現表格中追加行的js方法 //新增動態行(可在實現的列中新增相應的滑鼠事