Html2canvas: Nicht abgefangen (versprochen) Bereitgestelltes Element befindet sich nicht in einem Dokument

Erstellt am 14. Dez. 2017  ·  23Kommentare  ·  Quelle: niklasvh/html2canvas

Was bedeutet dieser Fehler? und wie man es repariert

Needs More Information

Hilfreichster Kommentar

Wenn Sie jQuery verwenden, um DIV-Verwendung zu finden
html2canvas($("#element")[0]).then(function(canvas) {
$("#element-out").append(Leinwand);
});

Alle 23 Kommentare

Das Element, das Sie rendern möchten, befindet sich nicht im Dokument-DOM

Also, wie kann man dieses Problem beheben?

0.5 ist in Ordnung, aber wenn ich auf 1 aktualisiere, bekomme ich diesen Fehler

Bitte teilen Sie ein Beispiel auf jsfiddle

Ich habe versucht, die html2canvas js (Version 1) und meine app js nach dem HTML-Body zu laden und dieses Problem wurde für mich behoben.

Hat jemand eine Lösung für dieses Problem, ich habe das gleiche Problem bei der Verwendung in ASP.Net MVC cshtml-Seite.

Wenn Sie jQuery verwenden, um DIV-Verwendung zu finden
html2canvas($("#element")[0]).then(function(canvas) {
$("#element-out").append(Leinwand);
});

Aber ich kann kein Bild von Google Map mit html2canvas aufnehmen (alle Kartenbilder kommen nicht). Kann mir jemand helfen, wie man dasselbe in cshtml macht ???

@cjcortez @RaghavPrabhu behebt die obige Lösung von smartbepl für Sie, vorausgesetzt, Sie verwenden jQuery oder eine andere Bibliothek, die eine Liste von Elementen anstelle eines einzelnen Element bereitstellt?

Das funktioniert bei mir!
html2canvas($('#div').get(0)).then( function (canvas) {
Konsole.log (Leinwand);
});

danke es hat geklappt

@jeremielodi Danke, das hat mich

Ich habe ähnlichen Code wie oben beschrieben ausprobiert, aber vielleicht hängt der Fehler, den ich erhalte, nicht ganz damit zusammen: Uncaught (in Promise) undefined ... Promise Rejected (async)

Ich hatte genau das gleiche Problem - ich wollte HTML2Canvas beim Klicken auf eine Schaltfläche aufrufen. Unabhängig davon, wie ich den HTML2Canvas-Aufruf geschrieben habe, würde ich den Fehler "Uncaught (in Promise) undefined ... Promise Rejected (async)" erhalten. Schließlich lernte ich ein wenig darüber, wie Versprechen funktionieren und stellte fest, dass die Lösung einen Haken hinzufügte:

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 */    
        });
}

Eine Warnung, ich bin ein absoluter Javascript-Neuling und verstehe sehr wenig darüber, wie Versprechen funktionieren. Mein Code funktionierte ohne .catch(), wenn ich ihn außerhalb einer Funktion verwendet habe. Ich gehe davon aus, dass es beim Einkapseln irgendwie nicht mehr den richtigen DOM-Zugriff hat und das Versprechen fehlschlägt.

@ikemike das kann dir helfen
```html


html2canvas


@niklasvh mit der neuesten Version von html2canvas Ich erhalte Uncaught (versprochen): undefinierter Fehler. Kannst du mir bitte helfen.

image

image

das funktioniert

Das funktioniert bei mir gut:

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");
    });
}

in Chrome funktioniert es gut, aber in IE11 funktioniert es nicht... T_T;

Unerwischt (versprochen): undefinierter Fehler

@bandacs hast du dafür eine Lösung gefunden? Ich erhalte genauen Fehler als Ihr Screenshot.

Ich benutze 1.0 Alpha 12 Release und habe das gleiche Problem. Ich habe alle diese Lösungen ausprobiert.

Ich habe diese Lösung von @smartbepl ausprobiert
html2canvas($("#element")[0]).then(function(canvas) {
$("#element-out").append(Leinwand);
});

Ich habe das versucht von @jeremielodi
html2canvas($('#div').get(0)).then( function (canvas) {
Konsole.log (Leinwand);
});

Ich habe auch die Leandrocgsi-Lösung ausprobiert und versucht, einen Haken hinzuzufügen, wie @ikemike vorschlägt.

Um es zu vereinfachen und sicherzustellen, dass alle Elemente in das DOM geladen werden, platziere ich eine Funktion namens take_screenshot().

Funktion take_screenshot()
{
html2canvas($(".image__container")[0]).then(canvas => {
console.log('Bitte arbeite, ich verliere den Verstand');
});
}
Dann rufe ich take_screenshot() direkt aus der Javascript-Konsole auf, um sicherzustellen, dass alles geladen ist.
Ich erhalte den gleichen Fehler Uncaught (in Versprechen) undefined.

Ich habe genau das gleiche Problem wie https://github.com/niklasvh/html2canvas/issues/1313#issuecomment -377132089
Kann jemand eine Lösung zu diesem Problem finden?

warum bin ich im cheerio gescheitert?

   .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

Es gibt jetzt eine andere Aufrufkonvention.
Version 0.5 erwartete den Knoten in einem Array, während Sie ihn jetzt direkt angeben.
Version 0.5 hatte die Option "onrendered", während Sie jetzt das Konstrukt "then" verwenden.

War diese Seite hilfreich?
0 / 5 - 0 Bewertungen

Verwandte Themen

anthonymejia picture anthonymejia  ·  4Kommentare

Loki180 picture Loki180  ·  4Kommentare

dking3876 picture dking3876  ·  4Kommentare

koreanman picture koreanman  ·  4Kommentare

celik75 picture celik75  ·  4Kommentare