我尝试使用此解决方案:
- 一个无形的iframe添加到页面
- 让表单提交到iframe中使用目标属性
- 使用的iframe的onload事件(被触发表单帖)重置我的按钮
这适用于Firefox,但当服务器响应是文件时,Chrome中不会触发onLoad事件。
我选定了该解决方案使用Cookie,并在所有浏览器上运行:
- 当用户点击下载按钮,添加一个隐藏字段包含一个随机值的形式。
- 在服务器上,查找包含随机值的表单字段并设置具有相同值的cookie。该cookie将设置下一个服务器响应,因此下载已经开始。
- 在客户端,开始轮询的饼干每秒左右去寻找随机值从步骤1
- 一旦客户发现价值,重置按钮。
这是从下载按钮的事件处理程序相关代码#nonce
是隐藏字段,我把随机值:
var nonce = Math.random(); // generate random number
$("#nonce").val(nonce); // set number as field value
$("#downloadDataset").button('loading'); // set button to loading state
var downloadTimer = setInterval(function() { // start polling the cookies
if (document.cookie.indexOf(nonce) != -1) {
$("#downloadDataset").button('reset'); // reset button
clearInterval(downloadTimer); // stop polling the cookies
}
}, 1000); // check every 1000ms
技术上*有*的方式从JavaScript开始下载。例如。 http://stackoverflow.com/questions/17126453/html-table-to-excel-javascript/17129220#17129220 –
不幸的是,一个数据网址的最大长度是非常有限的: _“data:”URL方案仅用于短的价值。请注意,一些使用URL的应用程序可能会施加长度限制;例如,嵌入在HTML中的定位符中的URL具有由HTML的SGML声明[RFC1866]确定的长度限制。 LITLEN(1024)限制了可以出现在单个属性值文字中的字符数,ATTSPLEN(2100)限制了出现在标签中的所有属性值规格的所有长度的总和,并且TAGLEN(2100)限制了标签的总长度._ – bmesuere