简单好用用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>标签有提供支持,但是如果本地没有安装邮箱,则无法打开, ...
随机推荐
- SQL Server 中函数的理解总结
T-SQL语言为我们提供了更加灵活的方式操作数据,那就是函数,函数总的分为三大类:标量函数:(传入一个参数,再传出一个参数)聚合函数(传入多个参数,传出一个参数),表值函数(传入一个结果集对象,让我们 ...
- PHP cURL的详细使用手册
PHP cURL的详细使用手册 PHP cURL可以帮助我们简单有效地去抓取网页内容,帮助我们方便的实现抓取功能.本文主要介绍了PHP cURL的使用方法. AD:2013云计算架构师峰会课程资料下载 ...
- sql备份(导出脚本)
第一步: 右键需要备份的数据库(这里以MyDB为例)-->任务-->生成脚本
- Java中设计模式之生产者消费者模式-4
引言 生产者-消费者(producer-consumer)问题,也称作有界缓冲区(bounded-buffer)问题,两个进程共享一个公共的固定大小的缓冲区.其中一个是生产者,用于将消息放入缓冲区:另 ...
- uibutton颜色设置
UIColor *color = [UIColor colorWithRed:100 / 255.0 green:20 / 255.0 blue:50 / 255.0 alpha:1.0];
- 机器学习:Python实现聚类算法(三)之总结
考虑到学习知识的顺序及效率问题,所以后续的几种聚类方法不再详细讲解原理,也不再写python实现的源代码,只介绍下算法的基本思路,使大家对每种算法有个直观的印象,从而可以更好的理解函数中参数的意义及作 ...
- 简单vue项目脚手架(vue+webpack2.0+vuex+vue-router)
github地址 使用技术栈 webpack(^2.6.1) webpack-dev-server(^2.4.5) vue(^2.3.3) vuex(^2.3.1) vue-router(^2.5.3 ...
- 快速排序(Quicksort)的Javascript实现
日本程序员norahiko,写了一个排序算法的动画演示,非常有趣. 这个周末,我就用它当做教材,好好学习了一下各种排序算法. 排序算法(Sorting algorithm)是计算机科学最古老.最基本的 ...
- 每天一个JS 小demo之树菜单。主要知识点:DOM方法综合运用,递归运用
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"& ...
- springmvc 之 返回值
springMVC对于controller处理方法返回值的可选类型 spring mvc 支持如下的返回方式:ModelAndView, Model, ModelMap, Map,View, Stri ...