需要引入

<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文件的更多相关文章

  1. js将json数据动态生成表格

    今天开发中遇到需要展示动态数据的问题, 具体要求是后端传来的json字符串,要在前端页面以table表格的形式展示, 其实没啥难的,就是拼接table标签,纯属体力活,于是自己写了个呆萌,保存起来,以 ...

  2. 初探原生js根据json数据动态创建table

    初探原生js根据json数据动态创建table 小生以实习生的职位进入了一家非纯软件的公司做asp.net开发,大半个月下来发现公司里居然没有前端工程师,这令我很诧异,跟着公司做项目,发现前端后台没有 ...

  3. 结合Bootbox将后台JSON数据填充Form表单

    本文介绍了如何结合Bootbox将后台JSON数据填充到Form表单中,同时也介绍了一些需要使用的知识的学习途径,并附上了参考文档地址与学习网址,对此感兴趣的伙伴可以直接访问学习.为了方便介绍,使用了 ...

  4. js遍历json数据

    先看看json返回的数据结构: 我需要遍历取出bookreno   与  title  加载到页面容器中去 首先我要取到 recommendedBookList  字典结构数据,然后遍历反射到相应对象 ...

  5. js读取json数据(php传值给js)

    <?php $array =array('fds','fdsa','fdsafasd');  // json_encode($array); ?> <html> <hea ...

  6. JS解析json数据并将json字符串转化为数组的实现方法

    json数据在ajax实现异步交互时起到了很重要的作用,他可以返回请求的数据,然后利用客户端的js进行解析,这一点体现出js的强大,本文介绍JS解析json数据并将json字符串转化为数组的实现方法, ...

  7. JS解析json数据

    JS解析json数据(如何将json字符串转化为数组) 1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN&q ...

  8. JSON数据的生成与解析

    JSON数据的生成与解析.首先先到网上下载一个json jar包,我用的是org.json 演示样例代码: package json; import org.json.JSONArray; impor ...

  9. js中json数据简单处理(JSON.parse()和js中嵌套html)

    js中json数据简单处理(JSON.parse()和js中嵌套html) 一.总结 1.html中嵌套js:<script>js代码</script> 2.js中嵌套html ...

随机推荐

  1. 前端面试题整理—ajax篇

    1.什么是Ajax和JSON,它们的优缺点 Ajax是全称是asynchronous JavaScript andXML,即异步JavaScript和xml,用于在Web页面中实现异步数据交互,实现页 ...

  2. Ubuntu中安装python3.6(转)

    因为TensorFlow只支持到python3.6,所以安装python3.6版本 Python3.6的使用越来越普遍.Ubuntu16.04的版本中默认胸自带python2和python3.5的版本 ...

  3. Vue.component注意事项

    Vue.component前不要加 new,否则报错: Uncaught TypeError: Cannot read property '_base' of undefined

  4. Windows jdk安装以及版本切换

    Windows jdk版本切换 一.安装 1.下载 官网: Java SE Development Kit 8 Downloads Java SE 7 Archive Downloads 1.7之前的 ...

  5. python 函数指动态形参,作用域

    函数的动态形参, 作用域 一 动态形参 如果我们需要给⼀一个函数传参, ⽽而参数⼜又是不确定的. 或者我给⼀一个 函数传很多参数, 我的形参就要写很多, 很⿇麻烦, 怎么办呢. 我们可以考虑使⽤用动态 ...

  6. LOJ #2026「JLOI / SHOI2016」成绩比较

    很好的锻炼推柿子能力的题目 LOJ #2026 题意 有$n$个人$ m$门学科,第$ i$门的分数为不大于$U_i$的一个正整数 定义A「打爆」B当且仅当A的每门学科的分数都不低于B的该门学科的分数 ...

  7. Codeforces #662C Binary Table

    听说这是一道$ Tourist$现场没出的题 Codeforces #662C 题意: 给定$n*m的 01$矩阵,可以任意反转一行/列($0$变$1$,$1$变$0$),求最少$ 1$的数量 $ n ...

  8. 微服务之Spring cloud

    微服务 Spring cloud Spring Cloud provides tools for developers to quickly build some of the common patt ...

  9. Vue.js简单记录

    官网:https://cn.vuejs.org/ https://cn.vuejs.org/v2/api/#methods v-bind 缩写 <!-- 完整语法 --> <a v- ...

  10. eclipse快捷键调试总结 -转--快捷键大全

    (1)Ctrl+M --切换窗口的大小(2)Ctrl+Q --跳到最后一次的编辑处(3)F2      ---重命名类名 工程名 --当鼠标放在一个标记处出现Tooltip时候按F2则把鼠标移开时To ...