在JavaScript中如何解决用execCommand(


Posted in Javascript onOctober 19, 2015

本解决方案仅适应asp.net mvc 开发环境,其他环境仅供参考。

问题描述:在开发中遇到这样的需求,保存页面,通常使用JavaScript的saveAs进行保存,各浏览器对saveAs支持,见下表。

在JavaScript中如何解决用execCommand(

代码一:初始保存的代码,只有IE6,7,8支持。

function CmdSave() {
  var OW = window.open('', "_blank", "");
  var DD = new Date();
  OW.document.open();
  var content = document.getElementById("content").innerHTML;
  OW.document.write(content);
  var name = mineName + "-" + $("#selDate").val() + ".htm";
  OW.document.execCommand("saveAs", false, name);//执行保存,IE6,IE7,IE8有效
  OW.close();
 }

解决方案:考虑到下载兼容性好,也能起到保存页面的作用,故采用了先生成页面,再下载页面这样的解决方案。

代码二:采用下载方式保存页面代码。

function CmdSave() {
  var css = "<style type='text/css'>.trNormalTd { border-top-width: 0px; border-bottom-width: 0px;text-align:right;}.trLastTd {border-top-width: 0px;text-align:right;}.trFirstTd{border-bottom-width: 0px;text-align: right;}</style>";
  var html = document.getElementById("content").innerHTML;
  var content = css + html;
  var name = mineName + "-" + $("#selDate").val() + ".htm";
  savePage(content, name);
}
 //content 内容 fileName 文件名 先在服务器生成页面,然后再下载生成的页面
 function savePage(content, fileName) {
  $.ajax({
   type: 'post',
   dataType: 'text',
   url: 'FXBB/BCYM',
   data: {
    content: content,
    fileName: fileName
   },
   success: function (result) {
    var url = "YXGZ/DBFX/BBCX/FXBB/XZYM?fileName=" + fileName;
    var downloadUrl = window.location.protocol + "//" + window.location.host + "/" + url;
    window.open(downloadUrl);//下载页面
    //deleteFile(fileName);
   },
   error: function (msg) {
    alert("保存出错");
   }
  });
 }
  //保存页面
  public int BCYM(string content, string fileName)
  {
   string path = System.AppDomain.CurrentDomain.BaseDirectory;
   path = Path.Combine(path, @"Upload\FXBB");
   //清空保存文件文件夹文件
   foreach (string d in Directory.GetFileSystemEntries(path))
   {
    if (File.Exists(d))
    {
     File.Delete(d);
    }
   }
   //生成要保存的页面
   path = System.AppDomain.CurrentDomain.BaseDirectory;
   path = Path.Combine(path, "Upload/FXBB/" + fileName);
   using (StreamWriter sw = new StreamWriter(path, false, Encoding.UTF8))// File.AppendText(path))
   {
    sw.WriteLine(content);
    sw.Flush();
   }
   return 1;
  }
//下载页面
  public void XZYM(string fileName)
  {
   string path = System.AppDomain.CurrentDomain.BaseDirectory;
   path = Path.Combine(path, @"Upload\FXBB\" + fileName);
   string filePath = path;//Server.MapPath("DownLoad/aaa.zip");//路径
   //以字符流的形式下载文件
   FileStream fs = new FileStream(filePath, FileMode.Open);
   byte[] bytes = new byte[(int)fs.Length];
   fs.Read(bytes, 0, bytes.Length);
   fs.Close();
   System.Web.HttpContext.Current.Response.ContentType = "application/octet-stream";
   //通知浏览器下载文件而不是打开
   System.Web.HttpContext.Current.Response.AddHeader("Content-Disposition", "attachment; filename=" + HttpUtility.UrlEncode(fileName, System.Text.Encoding.UTF8));
   System.Web.HttpContext.Current.Response.WriteFile(filePath);
  }

以上内容就是本文关于execcommand兼容性问题的全部叙述,希望大家喜欢。

Javascript 相关文章推荐
用javascript获取textarea中的光标位置
May 06 Javascript
javascript实现上传图片并预览的效果实现代码
Apr 11 Javascript
JavaScript获取网页表单提交方式的方法
Apr 02 Javascript
jquery代码规范让代码越来越好看
Feb 03 Javascript
vue自定义指令之面板拖拽的实现
Apr 14 Javascript
深入理解基于vue-cli的webpack打包优化实践及探索
Oct 14 Javascript
vue2.x 通过后端接口代理,获取qq音乐api的数据示例
Oct 30 Javascript
vue实现导航标题栏随页面滚动渐隐渐显效果
Mar 12 Javascript
JS实现单张或多张图片持续无缝滚动的示例代码
May 10 Javascript
为什么推荐使用JSX开发Vue3
Dec 28 Vue.js
详解Vue的七种传值方式
Feb 08 Vue.js
vue仿携程轮播图效果(滑动轮播,下方高度自适应)
Feb 11 Vue.js
简单谈谈Javascript中类型的判断
Oct 19 #Javascript
AngularJS 实现按需异步加载实例代码
Oct 18 #Javascript
学习javascript的闭包,原型,和匿名函数之旅
Oct 18 #Javascript
Javascript中的数据类型之旅
Oct 18 #Javascript
谈谈JavaScript自定义回调函数
Oct 18 #Javascript
JS实现的网页背景闪电闪烁效果代码
Oct 17 #Javascript
JavaScript实现点击按钮切换网页背景色的方法
Oct 17 #Javascript
You might like
用Apache反向代理设置对外的WWW和文件服务器
2006/10/09 PHP
关于zend studio 出现乱码问题的总结
2013/06/23 PHP
怎样使用php与jquery设置和读取cookies
2013/08/08 PHP
Yii实现MySQL多数据库和读写分离实例分析
2014/12/03 PHP
jqPlot 图表中文API使用文档及源码和在线示例
2012/02/07 Javascript
JQuery获取表格数据示例代码
2014/05/26 Javascript
jQuery选择器源码解读(五):tokenize的解析过程
2015/03/31 Javascript
属于你的jQuery提示框(Tip)插件
2016/01/20 Javascript
原生javascript实现匀速运动动画效果
2016/02/26 Javascript
JS获取随机数和时间转换的简单实例
2016/07/10 Javascript
微信小程序 网络API发起请求详解
2016/11/09 Javascript
react-native ListView下拉刷新上拉加载实现代码
2017/08/03 Javascript
微信小程序组件之srcoll-view的详解
2017/10/19 Javascript
JS手机端touch事件计算滑动距离的方法示例
2017/10/26 Javascript
Bootstrap modal只加载一次数据的解决办法(推荐)
2017/11/24 Javascript
javascript实现最长公共子序列实例代码
2018/02/05 Javascript
Vue通过provide inject实现组件通信
2020/09/03 Javascript
编写Python的web框架中的Model的教程
2015/04/29 Python
开始着手第一个Django项目
2015/07/15 Python
python更改已存在excel文件的方法
2018/05/03 Python
在windows下Python打印彩色字体的方法
2018/05/15 Python
pycharm 主题theme设置调整仿sublime的方法
2018/05/23 Python
Python爬虫的两套解析方法和四种爬虫实现过程
2018/07/20 Python
python实现一个简单的ping工具方法
2019/01/31 Python
Python3安装psycopy2以及遇到问题解决方法
2019/07/03 Python
seek引发的python文件读写的问题及解决
2019/07/26 Python
python如何求数组连续最大和的示例代码
2020/02/04 Python
基于Python词云分析政府工作报告关键词
2020/06/02 Python
Python‘==‘ 及 ‘is‘相关原理解析
2020/09/05 Python
CSS3 开发工具收集
2010/04/17 HTML / CSS
加拿大鞋子连锁店:Town Shoes
2016/09/26 全球购物
两则小学生的自我评价分享
2013/11/14 职场文书
2014年两会学习心得体会
2014/03/10 职场文书
出国签证在职证明
2014/09/20 职场文书
2015秋季运动会通讯稿
2015/07/18 职场文书
Python 机器学习工具包SKlearn的安装与使用
2021/05/14 Python