2

基本的に、私はと呼ばれる単純なライブラリを使用していますHTML2Canvas

これは私の現在のコードでうまく機能しておりonclick、ボタンからのイベントから呼び出されています:

function saveForm()
{
    html2canvas(document.body, {
            onrendered: function(canvas) {
                document.body.appendChild(canvas);
            }
        });
}

基本的には、スクリーン ショットを取得してページの下部に追加するだけです。

これに似た質問が既にありましたが、答えはうまくいかず、ダウンロードは常に破損した jpg ファイルです: html2canvas はブラウザで開かずに jpeg として保存

ページの下部に追加する代わりに、この関数内でダウンロードを強制する方法はありますか?

4

2 に答える 2

0

jQueryを使用してサーバー側のコードなしでダウンロードボタンを有効にするために、受け入れられたものに基づいて構築されたソリューションを次に示します。

https://codepen.io/nathansouza/pen/OXdJbo

function download(url){
  var a = $("<a style='display:none' id='js-downloder'>")
  .attr("href", url)
  .attr("download", "test.png")
  .appendTo("body");

  a[0].click();

  a.remove();
}

function saveCapture(element) {
  html2canvas(element).then(function(canvas) {
    download(canvas.toDataURL("image/png"));
  })
}

$('#btnDownload').click(function(){
  var element = document.querySelector("#capture");
  saveCapture(element)
})
于 2021-01-26T22:32:06.557 に答える