分享web开发知识

注册/登录|最近发布|今日推荐

主页 IT知识网页技术软件开发前端开发代码编程运营维护技术分享教程案例
当前位置:首页 > 技术分享

Js -----后台json数据,前端生成下载text文件

发布时间:2023-09-06 01:12责任编辑:白小东关键词:jsjson前端

需要引入

<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/

 1 ?// 返回错误信息弹框显示 2 ????@if (session(‘point_errors‘)) 3 ????????var point_errors = JSON.stringify({!! session()->pull(‘point_errors‘) !!}); 4 ?????????point_errors = JSON.parse( point_errors ); 5 ????????// console.log(point_errors); 6 ????????var text_content = ‘‘,msg = ‘‘,layer_content = ‘<p><input type="button" id="download_text" value="点击下载文件"></p>‘; 7 ????????$.each(point_errors, function(index, item) { 8 ????????????// 组织text内容 9 ????????????text_content += item[0] + ‘ ‘ + item[1] + ‘ ----‘10 ????????????????+ item[2] + ‘\r\n‘;11 12 ????????????msg = ‘<p style="padding:0;margin:0">‘+item[1] + ‘[‘13 ????????????????+ ?item[0] + ‘]----‘14 ????????????????+ ?item[2] + ‘</p>‘;15 ????????????layer_content += msg;16 ????????});17 18 ????????console.log(layer_content);19 ????????console.log(text_content);20 21 ????????// 下载文件方法22 ????????var funDownload = function (content, filename) {23 ????????????var eleLink = document.createElement(‘a‘);24 ????????????eleLink.download = filename;25 ????????????eleLink.style.display = ‘none‘;26 ????????????// 字符内容转变成blob地址27 ????????????var blob = new Blob([content]);28 ????????????eleLink.href = URL.createObjectURL(blob);29 ????????????// 触发点击30 ????????????document.body.appendChild(eleLink);31 ????????????eleLink.click();32 ????????????// 然后移除33 ????????????document.body.removeChild(eleLink);34 ????????};35 36 ????????if (‘download‘ in document.createElement(‘a‘)) {37 ????????????// 作为test.html文件下载38 ????????????$(document).on(‘click‘, ‘#download_text‘, function () {39 ????????????????funDownload(text_content, ‘导入失败的用户信息.text‘);40 ????????????});41 ????????} else {42 ????????????$(document).on(‘click‘, ‘#download_text‘, function () {43 ????????????????alert(‘浏览器不支持‘);44 ????????????});45 ????????}46 47 ????????setTimeout(function(){48 ????????????layer.open({49 ????????????????type: 1,50 ????????????????area: [‘500px‘, ‘600px‘],51 ????????????????content: layer_content,52 ????????????????scrollbar: true53 ????????????});54 ????????}, 2000);55 ????@endif

Js -----后台json数据,前端生成下载text文件

原文地址:http://www.cnblogs.com/smallyi/p/7569055.html

知识推荐

我的编程学习网——分享web前端后端开发技术知识。 垃圾信息处理邮箱 tousu563@163.com 网站地图
icp备案号 闽ICP备2023006418号-8 不良信息举报平台 互联网安全管理备案 Copyright 2023 www.wodecom.cn All Rights Reserved