So laden Sie ein Bild mit dem vom Benutzer eingegebenen Namen herunter

Question

Ich bin neu im Programmieren, insbesondere in JavaScript, also habe ich beschlossen, euch zu bitten, einen Blick darauf zu werfen und mir vielleicht bei der Suche nach einer Lösung zu helfen. Ich möchte ein Bild mit einem vom Benutzer eingegebenen Namen herunterladen. Ich möchte eine vom Benutzer angegebene Datei herunterladen und umbenennen, anstatt eine vordefinierte URL (wie in meinem Beispiel gezeigt). Ich bevorzuge den Download über das Frontend. Ich habe es in JavaScript versucht, aber es funktioniert nicht. Hat jemand eine Idee? Probieren Sie es aus https://jsfiddle.net/8qj3czvg/...

[https://jsfiddle.net/8qj3czvg/][1]

Answer 1

正如有人已经评论过的那样，您应该在应用程序中拥有一个最小的可重现示例；除此之外，您可以尝试以这种方式修改代码（请注意，可能需要额外的名称验证）。

HTML：

<form>
    <input type="text" id="file-name" class="form-control form_style" placeholder="Enter Name">
</form>

Js：

$(document).ready(function() {
    $('.is-hidden').click(function() {
        domtoimage
            .toPng(document.getElementById('content'), {
                quality: 0.95
            })
            .then(function(dataUrl) {
                let link = document.createElement('a');
                let name = document.getElementById('file-name').value;
                name = name ? name : "placeHolderName"; // checks whether the user has entered a file name
                link.download = `${name}.jpeg`;
                link.href = dataUrl;
                link.click();
            })
    })
})