zoukankan      html  css  js  c++  java
  • 利用html2canvas截图,得到base64上传ajax

    <script type="text/javascript" src="js/html2canvas.js"></script>
    
    //布局截图
    $(function(){
    //布局截图
    function htmlCanvas(){
    	html2canvas($(".J_screenshot"), {
                onrendered: function(canvas){
    //            document.body.appendChild(canvas);
                    var img = canvas.toDataURL();
                    var base=encodeURIComponent(img);//转码
    //              console.log(img); //在console中会输出图片的路径,然后复制在浏览器一粘贴,就可以看到。
                    //上传截图
                    ajaxUpLoad(base);
                },
    //300,
    //height:300
       	});
    };
    function ajaxUpLoad(base){
        $.ajax({
            type: "POST",
            url: "",
            async: true,
            data: {base:base},
            dataType: "json",
            success: function (data) {
            },
            error: function (err) {
            }
        });
    }
    }) 

    我们利用html2canvas的功能,得到了规定区域的页面截图,返回的是base64格式的图片,然后用ajax上传,要关注的点是base64要用encodeURIComponent()转义后才能传输。

  • 相关阅读:
    选校总结
    位运算
    剑指
    机器学习之梯度下降法
    leetcode1348 Tweet Counts Per Frequency
    UVA10308 Roads in the North 树的最长路径
    负数的处理POJ1179Polygon
    Roadblocks
    Bus Stop
    蒜头君的城堡之旅(动态规划)
  • 原文地址:https://www.cnblogs.com/AaronNotes/p/6483988.html
Copyright © 2011-2022 走看看