Question

我有一个移动页面，用户可以使用textarea创建自己的智能手机背景。我使用html2canvas将textarea转换为canvas并使用windwow.open + canvas.toDataURL在新选项卡中打开PNG以供用户保存。它适用于Chrome，但据我所知，Safari不允许我使用window.open。用户可以下载PNG吗？我在考虑使用按钮来翻译textarea链接到一个空的html文件，并将画布附加到那个空的html文件？但我不确定这是怎么回事。

非常感谢你！

这是我目前的JS：

$(function() { 
$("#buttononelandscape").click(function() { 
    html2canvas($("#testlandscape"), {


        onrendered: function(canvas) {
            theCanvas = canvas;

            window.open(canvas.toDataURL("image/png"));


        }

    });
});

}）;

Answer 1

在我看来，您是在间接调用window.open，而不是在直接响应用户事件。大多数浏览器会阻止这些调用（我很惊讶Chrome不是，但我不知道很多基本上关于画布渲染的任何内容）。

您可能需要将逻辑拆分为两个按钮：一个生成data: URI，然后另一个将其打开为新窗口，以便您可以执行{ {1}}直接回复用户点击。

如果我这样做，它适用于iPhone 5上的Safari：

window.open

和

<input type="button" value="Click Me">

Safari on Mobile阻止了window.open

1 个答案: