简单好用用js就可以保存文本文件到本地
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<link rel="stylesheet" href="//g.alicdn.com/msui/sm/0.6.2/css/sm.min.css">
<script type='text/javascript' src='//g.alicdn.com/sj/lib/zepto/zepto.min.js' charset='utf-8'></script>
<script type='text/javascript' src='//g.alicdn.com/msui/sm/0.6.2/js/sm.min.js' charset='utf-8'></script>
</head>
<body>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="description" content="A simple HTML5 Template">
<meta name="author" content="dron">
<meta name="viewport" content="width=device-width,
height=device-height, user-scalable=no, initial-scale=1.0,
maximum-scale=1.0">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<title>保存文本文件到本地</title>
<link href="http://ucren.com/static/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet">
<script src="http://ucren.com/static/jquery/2.2.3/jquery.min.js"></script>
<script src="http://ucren.com/static/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<style>
.container-fluid{ margin-top: 20px; }
</style>
</head>
<body>
<script>
void function(a){a.siteToolbar=function b(a){b.setting=a||{}},document.write
('<div class="ucren-toolbar-placeholder" style="height:3000px;"></div><scri'
+'pt src="//ucren.com/ucren-toolbar/scripts/main.js"><\/script>')}(this);
siteToolbar();
</script>
<div class="container-fluid">
<div class="row">
<div class="col-md-3">
<div class="form-group">
<label>文件内容</label>
<textarea class="form-control" rows="4" id="content">测试文本,你可以随便修改,完事后点保存。</textarea>
</div>
<div class="form-group">
<label>文件名</label>
<input type="text" class="form-control" value="test.txt" id="file-name">
</div>
<a id="save-btn" class="btn btn-default" download="test.txt" role="button">保存</a>
</div>
</div>
</div>
<script>
void function(){
var content, fileName, saveBtn;
content = document.querySelector( '#content' );
fileName = document.querySelector( '#file-name' );
saveBtn = document.querySelector( '#save-btn' );
content.addEventListener( 'change', function self(){
saveBtn.setAttribute( 'href', 'data:text/paint; utf-8,' + content.value );
return self;
}() );
fileName.addEventListener( 'change', function self(){
saveBtn.setAttribute( 'download', fileName.value );
return self;
}() );
}();
</script>
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-4190821-1', 'ucren.com');
ga('send', 'pageview');
</script>
</body>
</html>
</body>
</html>
简单好用用js就可以保存文本文件到本地的更多相关文章
- [JavaScript] js实现保存文件到本地
function fake_click(obj) { var ev = document.createEvent("MouseEvents"); ev.initMouseEvent ...
- 搭建一个简单的node.js服务器
第一步:安装node.js.可以去官网:https://nodejs.org/en/进行下载. 查看是否成功,只需在控制台输入 node -v.出现版本号的话,就证明成功了. 第二步:编写node.j ...
- LayaAir引擎开发HTML5最简单教程(面向JS开发者)
LayaAir引擎开发HTML5最简单教程(面向JS开发者) 一.总结 一句话总结:开发游戏还是得用游戏引擎来开发,其实很简单啦 切记:开发游戏还是得用游戏引擎来开发,其实很简单,引擎很多东西都帮你做 ...
- 用简单的 Node.js 后台程序浅析 HTTP 请求与响应
用简单的 Node.js 后台程序浅析 HTTP 请求与响应 本文写于 2020 年 1 月 18 日 我们来看两种方式发送 HTTP 请求,一种呢,是命令行的 curl 命令:一种呢是直接在浏览器的 ...
- php中关于js保存文件至本地的问题
最近在搞一个livezilla的在线客服聊天的东东,客户界面要求添加一个下载聊天记录的功能.于是我就是翻看了下网上的各种关于”js保存文件至本地“的资料,发现只能在IE下通过execCommand实现 ...
- [转]PROC简单使用用例--VC连接ORACLE
[转]PROC简单使用用例--VC连接ORACLE 操作系统:windows 7 数据库版本:oracle 10g VS版本:VS2010 前言:连接ORACLE的方式有很多,此处仅以PROC为例,说 ...
- 极其简单的用JS在浏览器中创建下载文件的方法
有这样一个需求,在js中动态创建一个页面,然后下载该页面为word文档,研究了一上午,最后发现实现起来如此简单. 在js中创建如下方法:(直接复制即可) function downloadFile(f ...
- 一段简单的顶部JS广告
一段简单的顶部JS广告 <SCRIPT LANGUAGE="JavaScript"> ; ; images = new Array; images[] = new Im ...
- js 判断是否可以打开本地软件
js判断时候可以打开本地的软件或者插件 点击一个按钮,打开本地的软件,比如问题反馈,需要调起本地的邮箱,填入一些信息. 这个功能<a>标签有提供支持,但是如果本地没有安装邮箱,则无法打开, ...
随机推荐
- Zepto源码分析-callbacks模块
// Zepto.js // (c) 2010-2015 Thomas Fuchs // Zepto.js may be freely distributed under the MIT licens ...
- Python教程(0)——介绍
What's Python? Python是一种编程语言,由荷兰人Guido van Rossum于1989年,为打发无聊的圣诞节而开发的. Python的优点是语法简洁,代码量比C/C++.Java ...
- Windows 修改电脑属性(一)
修改电脑属性里的注册信息 修改电脑属性的注册信息 运行注册表的方法:开始→运行→regedit→确定 1.CPU型号可以注册表编辑器中定位到下面的位置: HKEY_LOCAL_MACHINE\HARD ...
- 前端向后台的华丽转身 — PHP基础篇
这一次,本K带大家来看一下关于PHP中数组.字符串的一些注意事项和函数(方法). 一.PHP中的数组 (一)PHP中的数组简介 数组类型是PHP两种复合数据类型之一.根据下标的不同,可以将PHP中的数 ...
- java面试题之int和Integer的区别
int和Integer的区别 1.Integer是int的包装类,int则是java的一种基本数据类型 2.Integer变量必须实例化后才能使用,而int变量不需要 3.Integer实际是对象的引 ...
- final关键字(最终的)
1.fianl关键字可以用来修饰类.属性.方法: 2.final关键字修饰的类不能再继承: 如:String String类是final修饰的类不能被继承 3.final关键字修饰的方法不能被重写 ...
- Spring+SpringMVC+MyBatis深入学习及搭建(十)——MyBatis逆向工程
转载请注明出处:http://www.cnblogs.com/Joanna-Yan/p/6973266.html 前面讲到:Spring+SpringMVC+MyBatis深入学习及搭建(九)--My ...
- Spring Security3详细配置
Spring Security3详细配置 表名:RESOURCE 解释:资源表备注: 资源表 RESOURCE(资源表) 是否主键 字段名 字段描述 数据类型 长度 可空 约束 缺省值 备注 是 ID ...
- Javascript 严格模式use strict
一.概述 除了正常运行模式,ECMAscript 5添加了第二种运行模式:“严格模式”(strict mode).顾名思义,这种模式使得Javascript在更严格的条件下运行. 设立”严格模式”的目 ...
- position定位和添加阴影
定位:style="position: absolute; bottom: 0; width: 100%;background: rgb(255, 255, 255);padding-bot ...