Html2Canvas延迟渲染图像而不是序列

Abh*_*hek 5 jquery delay html2canvas

我遇到了Html2canvas渲染的问题,因为我想拍摄一个图像的多个屏幕截图并将其发送到序列中的所选联系人,但Html2canvas以延迟和无序的方式渲染图像,这反过来又无法发送图像到相应的选定联系人.下面是我的代码它运行成功但延迟和无序输出产生了很多问题.

function printCards(calle, eventID){
    var cards = new Array();

    var checkboxArray = $("input[name='contactsParty']:checked");

    $('#inviteContactName').html($(checkboxArray[0]).parent().prev().children('label').text());

        //  iterating selected checkboxes for invitation
        checkboxArray.each(function(index, value){


            //  getting name of next contact selected
            var name = $(checkboxArray[index+1]).parents().eq(1).find('label').text();


            //  Getting invitation card
            var invitationCard;
            $.when(invitationCard = getImage(name)).promise().done(function(){
                //  saving the printed invitation
                cards.push(invitationCard);
            });

        });

    return cards;   

}

//  printing invitation card with contact name
function getImage(name){

    var invitationCard = new Image();


        html2canvas($("#invitationData"), {
//          logging : true,
            onrendered: function(canvas) {
                //  For image`enter code here`
                var ctx=canvas.getContext("2d");
//              ctx.webkitImageSmoothingEnabled = false;
//              ctx.mozImageSmoothingEnabled = false;
                ctx.imageSmoothingEnabled = false;

                var convertedImage;
                $.when(convertedImage = canvas.toDataURL('image/jpg')).promise().done(function(){
                    invitationCard.src = convertedImage;
                    $('#inviteContactName').html(name);
                });  
//              setTimeout(function (){}, 500);
            }

        });

    return invitationCard;

}
Run Code Online (Sandbox Code Playgroud)

Jen*_*Jen 2

此问题已在即将发布的 html2canvas 中得到解决,因为此问题之前已在开发人员站点上多次提出。您只需要等待最终版本的生产,或者您可以尝试它的测试版本。

PS - 当前版本仅用于开发目的,不适用于生产。(这应该是一条评论,但我没有那么高的声誉。)