将页面内容保存为图片显示,长按保存至本地(html2canvas)

加载的html2canvas为官网上的新版本。

style样式:

*{
margin: 0;padding: 0;
font-family: "微软雅黑";
}
html,body{
100%;
}
#capture,#imgDiv{
100%;
}
.imgDiv_img{
100%;
}

html:

<div />
</div>

script代码:

<script src="js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
<script src="js/html2canvas.js" type="text/javascript" charset="utf-8"></script>

$(function() {
html2canvas(document.querySelector("#capture")).then(function(canvas) {
var imgUri = canvas.toDataURL("image/png").replace("image/png", "image/octet-stream"); // 获取生成的图片的url
$(".imgDiv_img").attr("src",imgUri)
})
});