2015-10-05 103 views
0

我從小提琴中獲得了一個代碼(http://jsfiddle.net/8ypxW/3/),用於將div轉換爲圖像。 但是當我試圖在我的網頁它不工作.. 下面是我的代碼....將div保存到圖像(不工作)

plz幫助我的朋友實現.......

<html> 
<head> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> 

<script> 
$(function() { 
    $("#btnSave").click(function() { 
     html2canvas($("#widget"), { 
      onrendered: function (canvas) { 
       theCanvas = canvas; 
       document.body.appendChild(canvas); 

       // Convert and download as image 
       Canvas2Image.saveAsPNG(canvas); 
       $("#img-out").append(canvas); 
      } 
     }); 
    }); 
}); 
</script> 
</head> 
<body> 
<span id="widget" class="widget"> 
    this is text. 
</span> 
<br/> 
<button id="btnSave">Save PNG</button> 

<div id="img-out"></div> 


</body> 

</html> 

回答

1

你只有jQuery核心包括在內。您需要項目中包含的其他js文件。

<script type='text/javascript' src="https://github.com/niklasvh/html2canvas/releases/download/0.4.1/html2canvas.js"></script> 

    <script type='text/javascript' src="http://www.nihilogic.dk/labs/canvas2image/base64.js"></script> 

    <script type='text/javascript' src="http://www.nihilogic.dk/labs/canvas2image/canvas2image.js"></script> 
+0

由於現在它的工作....但在小提琴..他們力包括任何文件....所以我認爲這將無需增加額外的文件 –

+0

的小提琴也包括他們的工作。在左邊查找'外部資源',這將列出任何外部資源與CSS文件或js文件。 –

+0

ohhhh非常感謝.... :) –

0

你參考正確的庫?在你的代碼中,你只能加載jquery文件。