如何在点击a标签下载文件的时候通过JavaScript动态的修改文件的名称?
前面一个是用来打开一个在线编辑页面,并将文件路径参数传递到该页面的a标签。
后面则是真正的下载a标签。但是现在的情况是,由于上传文件名存在重复,所以程序就自动生成了文件名。
现在想做的是,能不能在点击[下载]的时候,能将下载文件名改成原来的文件名。 尽量只使用前台的JavaScript,因为后台逻辑是别人写的,我不想该。 展开
<script type="text/javascript">
$("a").click(function () {
var href = this;
var url = href.href;
var name = href.innerHTML;
if (url.indexOf("kindeditor") >= 0) {
download(url, name);
return false;
}
})
/**
* 下载
* @param {String} url 目标文件地址
* @param {String} filename 想要保存的文件名称
*/
function download(url, filename) {
getBlob(url, function (blob) {
saveAs(blob, filename);
});
};
/**
* 获取 blob
* @param {String} url 目标文件地址
* @return {cb}
*/
function getBlob(url, cb) {
var xhr = new XMLHttpRequest();
xhr.open('GET', url, true);
xhr.responseType = 'blob';
xhr.onload = function () {
if (xhr.status === 200) {
cb(xhr.response);
}
};
xhr.send();
}
/**
* 保存
* @param {Blob} blob
* @param {String} filename 想要保存的文件名称
*/
function saveAs(blob, filename) {
if (window.navigator.msSaveOrOpenBlob) {
navigator.msSaveBlob(blob, filename);
} else {
var link = document.createElement('a');
var body = document.querySelector('body');
link.href = window.URL.createObjectURL(blob);
link.download = filename;
// fix Firefox
link.style.display = 'none';
body.appendChild(link);
link.click();
body.removeChild(link);
window.URL.revokeObjectURL(link.href);
};
}
</script>
如果你不想修改后台代码,我说下你看看这个方法可以不。你在a标签中再加个参数。
例如:../DaoFramer/ReadFile.aspx?FilePath=635000676971250000.ppt&name=OA培训130327.ppt,然后你在ReadFile.aspx这个页面的Js中修改。
var path=window.location.search;//返回?以后的内容,path值为?FilePath=635000676971250000.ppt&name=OA培训130327.ppt、
var name=path.split("&")[1].split("=")[1];//获取OA培训130327.ppt的值
然后在页面加载的最后 把值替换
你说加载替换是替换哪个部分?
把第二个下载a标签的路径替换吗?
实际上传后的文件名就是一个数字了,原来的名字只是记录在数据库里的一个字符串。
我现在希望这样解决。
在[下载]标签上加一个click事件,在点击下载的时候,将下载到用户桌面上的那个文件名改成原来的名字。原来的名字在html上也好找。就是这个下载标签的前一个a标签的innerText属性。