如何在Javascript中使用名称从textarea保存文件?

时间:2012-10-03 23:14:57

标签: javascript html5 download data-uri

  

可能重复:
  Using HTML5/Javascript to generate and save a file

我想要一个客户端HTML / JS解决方案来解决这个问题 - 我有一个用户可编辑的textarea A,一个文本字段B和一个按钮C.当用户点击C时,她获得一个名称等于B的文件下载.value和内容等于A.value。我查看了this,但没有指定如何设置文件名,我不想要像this这样的Flash解决方案。我们可以假设用户使用最新的Chrome浏览器(这对我的团队来说是一个小工具)

1 个答案:

答案 0 :(得分:4)

由于“我们可以假设用户使用最新的Chrome浏览器”,因此可以通过创建带有下载 href 属性的<a>来完成此类事情。 ,然后单击它。 下面的示例代码。

var Download = {
    click : function(node) {
        var ev = document.createEvent("MouseEvents");
        ev.initMouseEvent("click", true, false, self, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
        return node.dispatchEvent(ev);
    },
    encode : function(data) {
            return 'data:application/octet-stream;base64,' + btoa( data );
    },
    link : function(data, name){
        var a = document.createElement('a');
        a.download = name || self.location.pathname.slice(self.location.pathname.lastIndexOf('/')+1);
        a.href = data || self.location.href;
        return a;
    }
};
Download.save = function(data, name){
    this.click(
        this.link(
            this.encode( data ),
            name
        )
    );
};

Download.save('hello world', 'my_file.txt');