Js -----后台json数据,前端生成下载text文件
需要引入
<script src="/assets/libs/single_file/jquery.min.js"></script>
<script src="/assets/libs/layer/layer.js"></script>
借鉴 张鑫旭文章
http://www.zhangxinxu.com/wordpress/2017/07/js-text-string-download-as-html-json-file/
// 返回错误信息弹框显示
@if (session('point_errors'))
var point_errors = JSON.stringify({!! session()->pull('point_errors') !!});
point_errors = JSON.parse( point_errors );
// console.log(point_errors);
var text_content = '',msg = '',layer_content = '<p><input type="button" id="download_text" value="点击下载文件"></p>';
$.each(point_errors, function(index, item) {
// 组织text内容
text_content += item[0] + ' ' + item[1] + ' ----'
+ item[2] + '\r\n'; msg = '<p style="padding:0;margin:0">'+item[1] + '['
+ item[0] + ']----'
+ item[2] + '</p>';
layer_content += msg;
}); console.log(layer_content);
console.log(text_content); // 下载文件方法
var funDownload = function (content, filename) {
var eleLink = document.createElement('a');
eleLink.download = filename;
eleLink.style.display = 'none';
// 字符内容转变成blob地址
var blob = new Blob([content]);
eleLink.href = URL.createObjectURL(blob);
// 触发点击
document.body.appendChild(eleLink);
eleLink.click();
// 然后移除
document.body.removeChild(eleLink);
}; if ('download' in document.createElement('a')) {
// 作为test.html文件下载
$(document).on('click', '#download_text', function () {
funDownload(text_content, '导入失败的用户信息.text');
});
} else {
$(document).on('click', '#download_text', function () {
alert('浏览器不支持');
});
} setTimeout(function(){
layer.open({
type: 1,
area: ['500px', '600px'],
content: layer_content,
scrollbar: true
});
}, 2000);
@endif

Js -----后台json数据,前端生成下载text文件的更多相关文章
- js将json数据动态生成表格
今天开发中遇到需要展示动态数据的问题, 具体要求是后端传来的json字符串,要在前端页面以table表格的形式展示, 其实没啥难的,就是拼接table标签,纯属体力活,于是自己写了个呆萌,保存起来,以 ...
- 初探原生js根据json数据动态创建table
初探原生js根据json数据动态创建table 小生以实习生的职位进入了一家非纯软件的公司做asp.net开发,大半个月下来发现公司里居然没有前端工程师,这令我很诧异,跟着公司做项目,发现前端后台没有 ...
- 结合Bootbox将后台JSON数据填充Form表单
本文介绍了如何结合Bootbox将后台JSON数据填充到Form表单中,同时也介绍了一些需要使用的知识的学习途径,并附上了参考文档地址与学习网址,对此感兴趣的伙伴可以直接访问学习.为了方便介绍,使用了 ...
- js遍历json数据
先看看json返回的数据结构: 我需要遍历取出bookreno 与 title 加载到页面容器中去 首先我要取到 recommendedBookList 字典结构数据,然后遍历反射到相应对象 ...
- js读取json数据(php传值给js)
<?php $array =array('fds','fdsa','fdsafasd'); // json_encode($array); ?> <html> <hea ...
- JS解析json数据并将json字符串转化为数组的实现方法
json数据在ajax实现异步交互时起到了很重要的作用,他可以返回请求的数据,然后利用客户端的js进行解析,这一点体现出js的强大,本文介绍JS解析json数据并将json字符串转化为数组的实现方法, ...
- JS解析json数据
JS解析json数据(如何将json字符串转化为数组) 1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN&q ...
- JSON数据的生成与解析
JSON数据的生成与解析.首先先到网上下载一个json jar包,我用的是org.json 演示样例代码: package json; import org.json.JSONArray; impor ...
- js中json数据简单处理(JSON.parse()和js中嵌套html)
js中json数据简单处理(JSON.parse()和js中嵌套html) 一.总结 1.html中嵌套js:<script>js代码</script> 2.js中嵌套html ...
随机推荐
- vue常用的路由对象
官网上解释:一个路由对象表示当前激活的路由的状态信息 路由对象,在组件内即this.$route,存着一些与路由相关的信息,当路由切换时,路由对象会被更新 //如果要在刷新页面时候通过路由的信息来操作 ...
- Android MediaPlayer播放raw资源封装类
import android.content.Context; import android.media.MediaPlayer; import xxxx.R; public class MediaU ...
- Android GreenDao使用教程
1.在build.gradle里添加相关依赖 apply plugin: 'org.greenrobot.greendao' buildscript { repositories { mavenCen ...
- Mark Text - 下一代所见即所得的Markdown编辑器
Mark Text 所输及所见,摒弃了众多 markdown 编辑器左边写作右边预览的写作方式,巧妙的将编辑和预览融为一体.snabbdom 作为 Mark Text 的渲染引擎,保证了极速渲染编辑页 ...
- interactivePopGestureRecognizer --- iOS侧滑的问题
苹果一直都在人机交互中尽力做到极致,在iOS7中,新增加了一个小小的功能,也就是这个api:self.navigationController.interactivePopGestureRecogni ...
- faster rcnn相关内容
转自: https://zhuanlan.zhihu.com/p/31426458 faster rcnn的基本结构 Faster RCNN其实可以分为4个主要内容: Conv layers.作为一种 ...
- javascript判断节点是否在dom
在项目中碰到同事写的一段代码: //焦点必须在实时dom树中 if (ele && typeof this.document.contains === "function&q ...
- Python基础3(2017-07-20)
1.文件操作 现有文件如下: We were both young when I first saw you 当我第一次看见你的时候,我们都还年轻 I close my eyes and the fl ...
- java.lang.Enum
参考博客链接 java枚举类型的优势在哪里? Java 枚举(enum) 详解7种常见的用法
- 【Git】Git常见错误
错误1.fatal: refusing to merge unrelated histories 致命的:拒绝合并不相关的历史 原因:比如我本地分支是V1.0,我现在想要合并远程master分支上的内 ...