Warum gibt es das Nachladen nach dem Speichern von Bild? [Duplikat] ⇐ HTML

[Anonymous]

, um ein Bild auf meiner HTML -Seite mit: < /p>
zu speichern

Code: Select all

< /code>
Auf meiner HTML -Seite habe ich auch die nächste Schaltfläche: < /p>
Download Image
< /code>
Ich verwende den nächsten Code, um das Bild in diesem Canvas -Element zu speichern: < /p>
function saveCanvas2file(){
let canvas = document.getElementById('defaultCanvas0');
event.preventDefault();
// let ctx = canvas.getContext('2d');
}

document.getElementById('downloadCanvas0').addEventListener('click', function(e) {
// Convert our canvas to a data URL
let canvasUrl = canvas.toDataURL();
// Create an anchor, and set the href value to our data URL
const createEl = document.createElement('a');
createEl.href = canvasUrl;

// This is the name of our downloaded file
createEl.download = "download-this-canvas";

// Click the download button, causing a download, and then remove it
createEl.click();
createEl.remove();
});

Dies basiert auf: https://fjolt.com/article/html-canvas-save-as-image
Was ich nicht mache Verständnis ist, warum mein Formular neu laden scheint, alle eingegebenen Daten zu verlieren.
Vorschläge?