创建用户可以下载的文件时,安全问题通常会阻止直接写入其计算机。不过,可以在不涉及服务器的情况下创建文件并提示用户保存。
对于支持 HTML5 的浏览器,您可以使用以下代码:
function download(filename, text) { // Create an anchor element pointing to the file's content var element = document.createElement('a'); element.setAttribute('href', 'data:text/plain;charset=utf-8,' + encodeURIComponent(text)); element.setAttribute('download', filename); // Hide the anchor element element.style.display = 'none'; // Append the element to the body to enable the download document.body.appendChild(element); // Simulate a click event to trigger the download element.click(); // Remove the anchor element to prevent further interaction document.body.removeChild(element); }
在 HTML 代码中使用此函数如下:
<form onsubmit="download(this['name'].value, this['text'].value)"> <input type="text" name="name" value="test.txt"> <textarea name="text"></textarea> <input type="submit" value="Download"> </form>
当用户在表单中输入文件名和文件内容并单击“下载”按钮时,将下载文件,而无需与服务器交互。
以上是如何在不与服务器交互的情况下使用 JavaScript 在客户端下载文件?的详细内容。更多信息请关注PHP中文网其他相关文章!