在我的 JavaScript 中,我使用<a>
带有 download 属性的标签让用户下载生成的文件。我可以为文件设置默认名称,但是用户可能会在将其保存到系统之前更改它。有没有办法获取用户在保存对话框中写入的名称?
这样做的主要原因是,当用户再次下载文件时,我可以再次使用与默认名称相同的名称。
这是代码:
var json = JSON.stringify(currentProject, null, '\t');
var a = document.createElement('a');
a.href = URL.createObjectURL(new Blob([json], {type: 'text/json'}));
a.download = currentProjectName;
a.click();
如果无法使用<a>
标签方法,我想知道是否有其他下载方法可以以某种方式实现此目的。
我认为如果没有为最终用户定制客户端,您就无法做到这一点,保存对话框由操作系统控制,但您可以向用户提供在您的应用程序中重命名文件的功能,如下所示:repl.it 上的工作代码
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>Download</title>
</head>
<body>
<div>
<input type="text" id="filename-input" value="">
<a id="download" href="generated-filename.txt" download>Download</a>
</div>
<script>
document.addEventListener('DOMContentLoaded', loadDefaultFilename, false);
function loadDefaultFilename() {
// this could be value from database or cookie
let userDefaultFilename = localStorage.getItem('default-filename') || 'generared-file.txt';
let filenameInput = document.getElementById('filename-input');
let fileDownloadLink = document.getElementById('download');
fileDownloadLink.setAttribute('href', userDefaultFilename)
// load default filename from somewhere, e.g database or cookie
// set the default name
filenameInput.value = userDefaultFilename;
}
let button = document.getElementById('download');
button.addEventListener('click', function(e) {
const defaultFilename = document.getElementById('filename-input').value;
saveDefaultFilename(defaultFilename);
});
function saveDefaultFilename(filename) {
localStorage.setItem('default-filename', filename);
console.log(filename);
}
</script>
</body>
</html>
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)