IE兼容之读取本地文件

对于每个web开发者尤其前端开发来说，兼容ie通常是一个头疼的问题。最近恰好公司项目需要兼容ie9以上的ie浏览器，自己各种折腾才勉强搞定一些。自己爬过的坑，哭着也要给大家借鉴。废话少说，上代码；

此方法兼容ie9,以及chorme,firefox

html代码

<span id="fileSpan">
	<label for="file">导入json文件</label> //此处使用for可以直接将label绑定到下面的input元素
	<input style="display: none;" type="file" name="inputFile" id="file" onchange="importFile(this)">
</span>

js 代码

function importFile(element) {
	if (!element.files) {
		//兼容ie9
		var filePath = element.value;
		index = filePath.lastIndexOf("\\") || filePath.lastIndexOf("/");
		fileName = filePath.substring(index + 1);
		var fileType = fileName.substring(fileName.lastIndexOf("\.") + 1);
		if (fileType === "json") {
			try {
				fso = new ActiveXObject("Scripting.FileSystemObject");
				fileReader = fso.OpenTextFile(filePath, 1);
				fileContent = fileReader.ReadAll();
				fileReader.Close();
				var jsonData = JSON.parse(fileContent);
				//清空file
				var f = $("input[name='inputFile']:file");
				f.val("");
				var cf = f.clone();
				f.remove();
				cf.appendTo('#fileSpan');
			} catch (e) {
				alert("服务器不能创建对象；" + "\n" + "请按以下方法配置浏览器：" + "\n" + "请打开【Internet选项-安全-Internet-自定义级别-ActiveX控件和插件-对未标记为可安全执行脚本的ActiveX控件初始化并执行脚本（不安全）-点击启用-确定】");
			}
		} else {

			alert("请上传json文件");
		}
	} else {
		var file = element.files[0];
		var fileType = file.name.substring(file.name.lastIndexOf("\.") + 1);
		if (fileType === "json") {
			var jsonReader = new fileReader();
			jsonReader.onload = function(f) {
				jsonData = JSON.parse(f.target.result);
			}
			jsonReader.readAsText(file);
			$("#file").val():
		} else {
			alert("请上传json文件");
		}
	}
｝