Question

我不确定最好的办法是如此开放的建议！

我使用此代码将画布保存到png，效果很好：

function save_image() {
        html2canvas(document.getElementById('container'), {
            onrendered: function (canvas) {
            var imagedata = canvas.toDataURL('image/png');
            var imgdata = imagedata.replace(/^data:image\/(png|jpg);base64,/, "");

            $.ajax({
                url: 'save.php',
                data: {
                       imgdata:imgdata
                       },
                type: 'post',
                success: function (response) {  
                   $('#imgid img').attr('src', response);

                }
            });

        }
        });
    }

我希望用户能够将自己的形象分享到Facebook和pinterest。

当我将代码放在上面的成功函数中时，社交媒体代码的份额有效，但我想我会重复代码，所以我将沿着以下路线前进：

$(".pin").click(function(e) {
    saveimage();
    var image = $('#imgid img').attr('src');

    window.open('http://pinterest.com/pin/create/button/?'+ 'url='+encodeURIComponent("url here")+ '&media='+encodeURIComponent(image)+ '&description='+encodeURIComponent("title heree"));

});

然而，图像保存速度不够快，窗口立即打开，所以如果我再次单击保存在Pinterest上，则会显示图像。

保存功能完成后如何保存到社交媒体？

我也在为应用程序中的其他函数运行save_image（）函数，所以我试图不重复代码。

最好先找出图像保存的时间，然后分享到社交媒体，或者延迟打开窗口？还要确保窗口不会被adblock或弹出窗口阻止程序阻止！

有人可以帮忙指导吗？非常感谢

Answer 1

您需要回电功能

function save_image(callBackFun) {
        html2canvas(document.getElementById('container'), {
            onrendered: function (canvas) {
            var imagedata = canvas.toDataURL('image/png');
            var imgdata = imagedata.replace(/^data:image\/(png|jpg);base64,/, "");

            $.ajax({
                url: 'save.php',
                data: {
                       imgdata:imgdata
                       },
                type: 'post',
                success: function (response) {  
                   $('#imgid img').attr('src', response);
                   callBackFun();

                }
            });

        }
        });
    }

$(".pin").click(function(e) {

    function callBackFun(){
        var image = $('#image_id img').attr('src');
        window.open('http://pinterest.com/pin/create/button/?'+ 'url='+encodeURIComponent("url here")+ '&media='+encodeURIComponent(image)+ '&description='+encodeURIComponent("title heree"));
    }

    saveimage(callBackFun);

});

你的ajax请求完成后，

callBackFun 调用。

第一个函数完成后，Jquery运行另一个函数

1 个答案: