关于js合成图片 html2canvas

https://segmentfault.com/q/1010000006054722/a-1020000006056063

关于canvas的toDataURL报错问题

  1. <html>  

  2.     <head>  
  3.         <meta name="layout" content="main"> 
  4.  
  5.         <meta http-equiv="Content-

  6. Type" content="text/html; charset=utf-8" /> 
  7.    
  8.         
  9. <script type="text/javascript" src="http://ajax.googleapis.com/aj

  10. ax/libs/jquery/1.8.3/jquery.min.js"></script> 

  11.  
  12.         
  13. <script type="text/javascript" src="http://html2canvas.hertzen.co

  14. m/build/html2canvas.js"></script>  

  15.            
  16.         <script  type="text/javascript" >  

  17.         $(document).ready( function(){  

  1.                 $(".example1").on("click", function(event) { 
  2.  
  3.                         event.preventDefault();  

  1.                         html2canvas(document.body, { 
  2.  
  3.                         allowTaint: true, 
  4.  
  5.                         taintTest: false,  

  6.                         onrendered: function(canvas) { 
  7.  
  8.                             canvas.id = "mycanvas";  
  9.                             //document.body.appendChild(canvas);  
  10.                             //生成base64图片数据  
  11.                             var dataUrl = canvas.toDataURL(); 

  12.  
  13.                             var newImg = document.createElement("img");  
  14.                             newImg.src =  dataUrl

  15.  
  16.                             document.body.appendChild(newImg);  
  17.                         }  

  18.                     });  
  19.                 });   
  20.                
  21.         });  

  1.            
  2.         </script>  

  1.     </head>  

  1.     <body>  
  2.            
  3.         Hello!  
  4.         <div class="" style="background-color: #abc;">  

  1.             html5页面截图  

  1.             <br>jsjtt.com  

  1.         </div>  

  2.            
  3.         <textArea id="textArea" col="20" rows="10" ></textArea> 

  4.  
  5.         <input class="example1" type="button" value="button"> 

  6.   

  7.     </body>  




  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值