草庐IT

javascript - HTML5 JavaScript 下载属性

coder 2023-08-07 原文

我已经在一个项目上工作了几个月,现在已经接近尾声了。最后的步骤之一是提供一个文件,该文件将填充用户在 session 期间的操作所生成的信息。 Can I write files with HTML5/JS? ecmanaut 的回答让我非常接近,因为他提供了两种方法,一种是纯 html5,另一种是使用 JavaScript。

我最初使用的是 JavaScript 方法,它只能在 Chrome 中使用,而不能在 Mozilla 或 IE 中使用。因此,我使用纯 html5 方法结合一些替代 JavaScript 将其粘贴到页面,使其可以点击。

document.getElementById('download').innerHTML = '<a id="save" download="earth.txt" href="data:text/plain,mostly harmless&#10;and a bit more">Save</a>';

这段代码创建了一个下载的文件,但不包含文章所说的换行符 ' '.所以我做了一个搜索,看看还有哪些字符代码可以被识别。 http://en.wikipedia.org/wiki/Newline为我提供了许多可能的选择,但我尝试过的都没有奏效。我试过的是:' ', ' ', ' ', '', '\r\n', '\r', '\n', '\cr', '\c\r', 0x0D, 0x0A, 0c0D0A。在许多情况下,换行符被删除,什么也不会出现。

在测试上面的代码时,它在 Mozilla 和 Chrome 中工作(减去换行符),但在 IE 中的结果是不同的。当您单击“保存”链接时,它实际上会移动到该页面并具有作为数据内容的 url。

虽然这个项目在没有这个功能的情况下可能是可以接受的,但我非常希望在花费了很多时间和精力并且已经非常接近之后让它工作。我还需要在 Safari 中对此进行测试,但我尚未在该浏览器中进行任何测试。所需的浏览器支持从最重要到最不重要如下:Mozilla、Chrome、Safari、IE。如果可能的话,我想避免特定于浏览器的编码。

我还应该提到,就像在第一个链接中一样,我不想发送到服务器进行下载,我需要它在客户端本地工作,无需服务器交互。

总而言之,我至少需要让换行符适用于该文件,以便 Mozilla 和 Chrome 都能正常工作。如果可能,还有一种方法可以让文件在 IE 中正常工作。

编辑:本地时间 2014 年 11 月 3 日下午 1:40 我已经尝试了 maths4js 关于更改我的引号的建议编辑,但该建议没有用。我注意到提交更大的示例代码页面将是一个有用的想法。还建议我看看哪些浏览器支持这个功能http://caniuse.com/#feat=download IE 和 Safari 似乎没有,所以我现在不会担心它们,也许 future 会有针对它们的浏览器特定编码。

<!DOCTYPE HTML>
<html>
<head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"/><style>body{margin: 0px;padding: 0px;}</style></head><body><center><br><div id='download'></div></center>
<script>
function download(){
//var newline= '&#10';  //no line breaks
//var newline= '&#10;'; //no line breaks
//var newline= "&#10;"; //no line breaks
//var newline= "&#10";          //no line breaks
//var newline= "\r\n";      //no line breaks
//var newline= "\r\n;";     //appends ; but no line breaks
//var newline = '\n';       //no line break 
//var newline = '/n';   //completely failed
var newline = 0x0D0A;
var tab = "       ";
var text = "Title of the document" + newline;
text += "Just a line of text : ";
text = text +"Random";
text = text + newline + "Trial" + tab + "Time" + tab + "Correct" + newline;
//document.getElementById('download').innerHTML = '<a id="save" download="This_File.txt" href="data:text/plain,'+text+'">Save</a>';
//document.getElementById('download').innerHTML = '<a id="save" download="earth.txt" href="data:text/plain,mostly harmless&#10;and a bit more">Save</a>';
document.getElementById('download').innerHTML = "<a id='save' download='earth.txt' href='data:text/plain,mostly harmless&#10;and a bit more'>Save</a>";
}
download();

</script>
</body>
</html>      

我要感谢大家已经付出的努力和时间。

最佳答案

尝试使用 window.btoa 函数将您的文本转换为 base64:

var myText = btoa('mostly harmless\n\rand a bit more');
document.getElementById('download').innerHTML = '<a id="save" download="earth.txt" href="data:text/plain;base64,' + myText + '">Save</a>';
<div id="download"></div>

应该可以工作,因为 base64 正确编码/维护换行符。

关于javascript - HTML5 JavaScript 下载属性,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26721542/

有关javascript - HTML5 JavaScript 下载属性的更多相关文章

  1. ruby - 使用 ruby​​ 将 HTML 转换为纯文本并维护结构/格式 - 2

    我想将html转换为纯文本。不过,我不想只删除标签,我想智能地保留尽可能多的格式。为插入换行符标签,检测段落并格式化它们等。输入非常简单,通常是格式良好的html(不是整个文档,只是一堆内容,通常没有anchor或图像)。我可以将几个正则表达式放在一起,让我达到80%,但我认为可能有一些现有的解决方案更智能。 最佳答案 首先,不要尝试为此使用正则表达式。很有可能你会想出一个脆弱/脆弱的解决方案,它会随着HTML的变化而崩溃,或者很难管理和维护。您可以使用Nokogiri快速解析HTML并提取文本:require'nokogiri'h

  2. ruby-on-rails - 如果为空或不验证数值,则使属性默认为 0 - 2

    我希望我的UserPrice模型的属性在它们为空或不验证数值时默认为0。这些属性是tax_rate、shipping_cost和price。classCreateUserPrices8,:scale=>2t.decimal:tax_rate,:precision=>8,:scale=>2t.decimal:shipping_cost,:precision=>8,:scale=>2endendend起初,我将所有3列的:default=>0放在表格中,但我不想要这样,因为它已经填充了字段,我想使用占位符。这是我的UserPrice模型:classUserPrice回答before_val

  3. ruby-on-rails - 在混合/模块中覆盖模型的属性访问器 - 2

    我有一个包含模块的模型。我想在模块中覆盖模型的访问器方法。例如:classBlah这显然行不通。有什么想法可以实现吗? 最佳答案 您的代码看起来是正确的。我们正在毫无困难地使用这个确切的模式。如果我没记错的话,Rails使用#method_missing作为属性setter,因此您的模块将优先,阻止ActiveRecord的setter。如果您正在使用ActiveSupport::Concern(参见thisblogpost),那么您的实例方法需要进入一个特殊的模块:classBlah

  4. ruby - 如何使用 Ruby aws/s3 Gem 生成安全 URL 以从 s3 下载文件 - 2

    我正在编写一个小脚本来定位aws存储桶中的特定文件,并创建一个临时验证的url以发送给同事。(理想情况下,这将创建类似于在控制台上右键单击存储桶中的文件并复制链接地址的结果)。我研究过回形针,它似乎不符合这个标准,但我可能只是不知道它的全部功能。我尝试了以下方法:defauthenticated_url(file_name,bucket)AWS::S3::S3Object.url_for(file_name,bucket,:secure=>true,:expires=>20*60)end产生这种类型的结果:...-1.amazonaws.com/file_path/file.zip.A

  5. ruby-on-rails - Rails HTML 请求渲染 JSON - 2

    在我的Controller中,我通过以下方式在我的index方法中支持HTML和JSON:respond_todo|format|format.htmlformat.json{renderjson:@user}end在浏览器中拉起它时,它会自然地以HTML呈现。但是,当我对/user资源进行内容类型为application/json的curl调用时(因为它是索引方法),我仍然将HTML作为响应。如何获取JSON作为响应?我还需要说明什么? 最佳答案 您应该将.json附加到请求的url,提供的格式在routes.rb的路径中定义。这

  6. ruby - 多个属性的 update_column 方法 - 2

    我有一个具有一些属性的模型:attr1、attr2和attr3。我需要在不执行回调和验证的情况下更新此属性。我找到了update_column方法,但我想同时更新三个属性。我需要这样的东西:update_columns({attr1:val1,attr2:val2,attr3:val3})代替update_column(attr1,val1)update_column(attr2,val2)update_column(attr3,val3) 最佳答案 您可以使用update_columns(attr1:val1,attr2:val2

  7. ruby-on-rails - 使用 Sublime Text 3 突出显示 HTML 背景语法中的 ERB? - 2

    所以我在关注Railscast,我注意到在html.erb文件中,ruby代码有一个微弱的背景高亮效果,以区别于其他代码HTML文档。我知道Ryan使用TextMate。我正在使用SublimeText3。我怎样才能达到同样的效果?谢谢! 最佳答案 为SublimeText安装ERB包。假设您安装了SublimeText包管理器*,只需点击cmd+shift+P即可获得命令菜单,然后键入installpackage并选择PackageControl:InstallPackage获取包管理器菜单。在该菜单中,键入ERB并在看到包时选择

  8. ruby - Nokogiri 剥离所有属性 - 2

    我有这个html标记:我想得到这个:我如何使用Nokogiri做到这一点? 最佳答案 require'nokogiri'doc=Nokogiri::HTML('')您可以通过xpath删除所有属性:doc.xpath('//@*').remove或者,如果您需要做一些更复杂的事情,有时使用以下方法遍历所有元素会更容易:doc.traversedo|node|node.keys.eachdo|attribute|node.deleteattributeendend 关于ruby-Nokog

  9. ruby-on-rails - Rails 模型——非持久类成员或属性? - 2

    对于Rails模型,是否可以/建议让一个类的成员不持久保存到数据库中?我想将用户最后选择的类型存储在session变量中。由于我无法从我的模型中设置session变量,我想将值存储在一个“虚拟”类成员中,该成员只是将值传递回Controller。你能有这样的类(class)成员吗? 最佳答案 将非持久属性添加到Rails模型就像任何其他Ruby类一样:classUser扩展解释:在Ruby中,所有实例变量都是私有(private)的,不需要在赋值前定义。attr_accessor创建一个setter和getter方法:classUs

  10. ruby - 安装 Ruby 时遇到问题(无法下载资源 "readline--patch") - 2

    当我尝试安装Ruby时遇到此错误。我试过查看this和this但无济于事➜~brewinstallrubyWarning:YouareusingOSX10.12.Wedonotprovidesupportforthispre-releaseversion.Youmayencounterbuildfailuresorotherbreakages.Pleasecreatepull-requestsinsteadoffilingissues.==>Installingdependenciesforruby:readline,libyaml,makedepend==>Installingrub

随机推荐