javascript - 使用 html2canvas 提交时从表单创建屏幕截图

Question

我尝试在使用 html2canvas 提交时从表单创建屏幕截图。 我使用这段代码:

//Create Screen
var element = $("#formmain");
var getCanvas;
html2canvas(document.querySelector("#formmain")).then(canvas => {
    document.body.appendChild(canvas),
    save_img(canvas.toDataURL('image/jpeg'))
});

save_img函数:

function save_img(data){
    //ajax method.
    $.post('save_screen.php', {data: data}, function(res){
        //if the file saved properly, trigger a popup to the user.
        if(res != ''){
            yes = confirm('File saved in output folder, click ok to see it!');
            if(yes){
                location.href =document.URL+'temp/'+res+'.jpg';
            }
        }
        else{
            alert('something wrong');
        }
    });
}

它正在创建屏幕截图，但输入表单字段始终为空 在屏幕中。

Answer 1

试试这个:

html2canvas(document.querySelector("#formmain"), {
       onrendered: function(canvas) {
       document.body.appendChild(canvas);
    },
});