在功能区管理系统中,在上传区域网格、道路交通、以及功能区类型的xls文件时,每一个同名文件仅可以上传一次,如果下次修改了文件内容,除非刷新网页,否则上传的文件并没有生效。因此这是一个bug,在网上找了好多解决方案,最终得以成功突破。。
解决办法是这样的:
1.原始方法:把事件写在file控件的onchange=""里面;
2.Jquery方法一: $('#fileId').live('change',function(){ //逻辑添加.... });
3.Jquery方法二: onchange后,生成一个新input type file代替旧的,
$('#inputFileID').replaceWith('<input name="fileToUpload" type="file" id="inputFileID" />');
项目中用的就是原始方法,然后在imortf函数内部,每次调用一个新的input type file代替就得input…代码如下:
HTML脚本如下:
<a href="javascript:;" class="file" style="display: inline-block;width: 65px;height: 25px;border-radius: 4px;color: #fff;text-decoration: none;font-size: 14px;background-color: #057CBE;text-align: center;line-height: 25px;">
上传文件
<input id="file_upload" accept=".xls,.xlsx" onchange="importf(this)" name="file" type="file" style="width: 140px;position: absolute;font-size: 14px;height: 25px;left: 57%;opacity: 0;"/>
</a>
JS脚本如下:
// 上传excel文件
var wb; //读取完成的数据
var rABS = false; //是否将文件读取为二进制字符串
//上传函数
function importf(obj) {
if (!obj.files) {
return;
}
try {
var f = obj.files[0];
var reader = new FileReader();
reader.onload = function (e) {
var data = e.target.result;
if (rABS) {
wb = XLSX.read(btoa(fixdata(data)), {//手动转化
type: 'base64'
});
} else {
wb = XLSX.read(data, {
type: 'binary'
});
}
var data1 = JSON.stringify(XLSX.utils.sheet_to_json(wb.Sheets[wb.SheetNames[0]]));
//读取页面demo中的内容
demo = JSON.parse(data1);
console.log(demo);
//获取选择的文件类型,调用不同的家口保存至数据库
var select_type = $("#select_upload_type").val();
if (select_type == "区域网格") {
upload_grid(demo);
} else if (select_type == "声功能区") {
upload_gongnengType(demo);
} else if (select_type == "道路交通") {
upload_road(demo);
} else {
}
};
if (rABS) {
reader.readAsArrayBuffer(f);
} else {
reader.readAsBinaryString(f);
}
//进行网页html结构的替换,如果不加这句话,每次上传文件只能上传一次
$("#file_upload").replaceWith('<input id="file_upload" accept=".xls,.xlsx" onchange="importf(this)" name="file" type="file" style="width: 140px;position: absolute;font-size: 14px;height: 25px;left: 57%;opacity: 0;"/>');
} catch (e) {
alert('请选择正确类型'); //异常捕获
}
}
文件每次上传后,调用$(“#file_upload”).replaceWith(‘’);就可以实现文件的多次上传了。。