Html2canvas: Non capturé (dans la promesse) L'élément fourni n'est pas dans un document

Créé le 14 déc. 2017  ·  23Commentaires  ·  Source: niklasvh/html2canvas

Quelle est la signification de cette erreur ? et comment y remédier

Needs More Information

Commentaire le plus utile

Si vous utilisez jQuery pour trouver l'utilisation de DIV
html2canvas($("#element")[0]).then(function(canvas) {
$("#element-out").append(canvas);
});

Tous les 23 commentaires

L'élément que vous essayez de rendre n'est pas dans le DOM du document

Alors comment régler ce problème ?

0.5 c'est bien mais quand je passe à 1 j'ai cette erreur

Veuillez partager un exemple sur jsfiddle

J'ai essayé de charger le html2canvas js (version 1) et mon application js après le corps HTML et ce problème a été résolu pour moi.

Quelqu'un a-t-il un correctif pour ce problème, j'ai le même problème lors de l'utilisation dans la page ASP.Net MVC cshtml.

Si vous utilisez jQuery pour trouver l'utilisation de DIV
html2canvas($("#element")[0]).then(function(canvas) {
$("#element-out").append(canvas);
});

Mais je ne parviens pas à prendre une image de google map en utilisant html2canvas (toute l'image de la carte ne vient pas), quelqu'un peut-il m'aider à faire la même chose en cshtml ???

@cjcortez @RaghavPrabhu est-ce que la solution de smartbepl ci-dessus le résout pour vous en supposant que vous utilisez jQuery ou une autre bibliothèque qui fournit une liste d'éléments au lieu d'un seul Element ?

Cela fonctionne pour moi !
html2canvas($('#div').get(0)).then( function (canvas) {
console.log(canevas);
});

merci ça a marché

@jeremielodi Merci, ça me

J'ai essayé un code similaire à celui-ci, mais peut-être que l'erreur que j'obtiens n'est pas tout à fait liée : Uncaught (in promise) undefined... Promesse rejetée (async)

J'avais exactement le même problème - je voulais appeler HTML2Canvas en cliquant sur un bouton. Quelle que soit la façon dont j'ai écrit l'appel HTML2Canvas, j'obtiendrais une erreur "Uncaught (in promise) undefined...Promise rejetée (async)". Enfin, j'ai appris un peu sur le fonctionnement des promesses et j'ai trouvé que la solution était d'ajouter une capture :

function myFunction() {
    html2canvas(document.querySelector("#capture")).then(canvas => {          
            var base64encodedstring = canvas.toDataURL("image/jpeg", 1).replace("data:image/jpeg;base64,", "");
            j$("[id$='inputHidden']").val(base64encodedstring);
            console.log('Saving...');
            mySaveFunction();
        })
        .catch(function (error) {
            /* This is fired when the promise executes without the DOM */    
        });
}

Attention, je suis un novice en javascript et je comprends très peu le fonctionnement des promesses. Mon code a bien fonctionné sans le .catch() si je l'ai utilisé en dehors d'une fonction. Je suppose que d'une manière ou d'une autre, lorsque vous l'encapsulez, il n'a plus l'accès DOM correct et la promesse échoue.

@ikemike ça peut t'aider
```html


html2canvas


@niklasvh avec la dernière version de html2canvas Je reçois Uncaught (en promesse): erreur non définie. Pouvez-vous m'aider s'il vous plaît.

image

image

ça marche

Cela fonctionne bien pour moi:

function downloadURI(uri, name) {
    var link = document.createElement("a");

    link.download = name;
    link.href = uri;
    document.body.appendChild(link);
    link.click();
    clearDynamicLink(link); 
}

function DownloadAsImage() {
    var element = $("#table-card")[0];
    html2canvas(element).then(function (canvas) {
        var myImage = canvas.toDataURL();
        downloadURI(myImage, "cartao-virtual.png");
    });
}

en chrome, ça marche bien, mais dans IE11, ça ne marche pas... T_T;

Uncaught (en promesse): erreur non définie

@bandacs avez-vous trouvé une solution à cela ? J'obtiens une erreur exacte comme votre capture d'écran.

J'utilise la version 1.0 alpha 12 et j'ai le même problème. J'ai essayé toutes ces solutions.

J'ai essayé cette solution par @smartbepl
html2canvas($("#element")[0]).then(function(canvas) {
$("#element-out").append(canvas);
});

J'ai essayé ceci par @jeremielodi
html2canvas($('#div').get(0)).then( function (canvas) {
console.log(canevas);
});

J'ai également essayé la solution leandrocgsi et j'ai essayé d'ajouter une capture comme le suggère @ikemike .

Pour le simplifier et m'assurer que tous les éléments sont chargés sur le DOM, je place une fonction appelée take_screenshot().

fonction take_screenshot()
{
html2canvas($(".image__container")[0]).then(canvas => {
console.log('travaillez s'il vous plaît, je perds la tête');
});
}
J'appelle ensuite take_screenshot() directement depuis la console javascript pour m'assurer que tout est chargé.
J'obtiens la même erreur Uncaught (en promesse) undefined.

J'ai exactement le même problème que celui rencontré par https://github.com/niklasvh/html2canvas/issues/1313#issuecomment -377132089
Quelqu'un a-t-il trouvé une solution à ce problème ?

pourquoi j'ai échoué dans cheerio?

   .get(url)
   .end((err, res) => {
       cheerio.load(res.text)
       html2Canvas($('#statuses').get(0), {
           allowTaint: true
       }).then(function(canvas) {})
})
Uncaught (in promise) Error: Element is not attached to a Document

Il y a maintenant une autre convention d'appel.
La version 0.5 attendait le nœud dans un tableau, alors que vous le donnez maintenant directement.
La version 0.5 avait l'option "onrendered", alors que vous utilisez maintenant la construction "then".

Cette page vous a été utile?
0 / 5 - 0 notes

Questions connexes

tjchambers32 picture tjchambers32  ·  3Commentaires

anthonymejia picture anthonymejia  ·  4Commentaires

ABHIKSINGHH picture ABHIKSINGHH  ·  3Commentaires

kunal886496 picture kunal886496  ·  3Commentaires

tibewww picture tibewww  ·  4Commentaires