Expelをアップロードしてブラウザに表示します.プレビュー効果と似ています.
方法1
xlsx.jsプラグインを使用して、IE 11をサポートし、ie 8をサポートしません.
方法2
IEIブラウザに付属の ActiveXObjectオブジェクト
xlsx.jsプラグインを使用して、IE 11をサポートし、ie 8をサポートしません.
Excel
$('#excel-file').change(function(e) {
try {
new Uint8Array([1,2]).slice(0,2);
} catch (e) {
console.log("[Uint8Array"+e.description+"] 【Array.slice】。");
//IE Uint8Array.slice() 。 Array.slice()
Uint8Array.prototype.slice = Array.prototype.slice;
}
var url=$('#excel-file').val();
if(!url){return;}
var suffix=url.substring(url.lastIndexOf(".")+1,url.length);
if(!(suffix=="xls"||suffix=="xlsx")){
return alert(" ");
}
var files = e.target.files;
var fileReader = new FileReader();
fileReader.readAsArrayBuffer(files[0]);//
fileReader.onload = function(ev) {
$('#excel-file').val('');
$("#context").html("");
try {
var data = ev.target.result;
var workbook = XLSX.read(data, { type: 'array'}),
persons = [];
} catch (e) {
console.error(e);
return alert(' !');
}
//
for (var sheet in workbook.Sheets) {
if (workbook.Sheets.hasOwnProperty(sheet)) {
persons = persons.concat(XLSX.utils.sheet_to_json(workbook.Sheets[sheet], { raw: true, header: 1 }));
console.log(JSON.stringify(persons));
for ( var i = 0; i <persons.length; i++){
var person=persons[i];
var tr='<tr id="tr-'+i+'">';
for (var j = 0; j <person.length; j++){
tr+='<td>'+$.trim(person[j]?person[j]:"")+'</td>';
}
for (var k = 0; k < (6-person.length); k++) {
tr+='<td></td>';
}
tr += "</td>";
$("#context").append(tr);
}
break;// ， beak
}
}
};
});
方法2
IEIブラウザに付属の ActiveXObjectオブジェクト
<script src="jquery.js"/>
<script>
// IE8 console
window.console = window.console || (function () {
var c = {}; c.log = c.warn = c.debug = c.info = c.error = c.time = c.dir = c.profile
= c.clear = c.exception = c.trace = c.assert = function () { };
return c;
})();
function uploads() {
$("#excel-file").click();
}
function Export() {
var url = document.getElementById("excel-file").value;
if (!url) { return; }
var suffix = url.substring(url.lastIndexOf(".") + 1, url.length);
if (!(suffix == "xls" || suffix == "xlsx")) {
return alert(" ");
}
importf(url);
}
function importf(url) {//
// EXCEL json
var jsondata = sheet_to_json(url);
var column = [];
var data = [column];
for (var key in jsondata[0]) {//
data[0].push(key);
}
for (var i = 0; i < jsondata.length; i++) {
var row = [];
data.push(row);
for (var key in jsondata[i]) {
data[i + 1].push(jsondata[i][key]);
}
}
//console.log(data);
// Json
var str;
for (var key in data) {///IE8 let , js var IE （ ）
console.log(key + '---' + data[key])
str = "<tr>";
for (var key1 in data[key]) {///IE8 let , js var
//console.log(key1 + '---' + data[key][key1])
if (data[key][key1] == "undefined") {
str += "<td> </td>";
} else {
str += "<td>" + data[key][key1] + "</td>";
}
}
str += "</tr>"
$("#tab").append(str);
}
}
function sheet_to_json(filePath) {
var oXL = new ActiveXObject("Excel.Application");
var oWB = oXL.Workbooks.open(filePath);
oWB.worksheets(1).select();
var oSheet = oWB.ActiveSheet;
var jsondata = [];
//debugger
for (var row = 1; (oSheet.Cells(row, 1) + '') != 'undefined'; row++) { //
//for (var col = 1; (oSheet.Cells(row, col) + '') != 'undefined'; col++) {
for (var col = 1; col <= 10; col++) {// ， 、
if (row > 1) {
//console.log(oSheet.Cells(row, col).value);
jsondata[row - 2] += '"' + oSheet.Cells(1, col).value + '":' + '"' + oSheet.Cells(row, col).value + '",';
}
}
if (row > 1) {
jsondata[row - 2] = JSON.parse(('{' + jsondata[row - 2].substr(0, jsondata[row - 2].lastIndexOf(',')) + '}').replace('undefined', ''));
}
}
oWB.close();
oXL.Application.Quit();
return jsondata;
}
/**********************************************json IE8*****************************************************/
//json ：
if (!window.JSON) {
window.JSON = {
parse: function (jsonStr) {
return eval('(' + jsonStr + ')');
},
stringify: function (jsonObj) {
var result = '',
curVal;
if (jsonObj === null) {
return String(jsonObj);
}
switch (typeof jsonObj) {
case 'number':
case 'boolean':
return String(jsonObj);
case 'string':
return '"' + jsonObj + '"';
case 'undefined':
case 'function':
return undefined;
}
switch (Object.prototype.toString.call(jsonObj)) {
case '[object Array]':
result += '[';
for (var i = 0, len = jsonObj.length; i < len; i++) {
curVal = JSON.stringify(jsonObj[i]);
result += (curVal === undefined ? null : curVal) + ",";
}
if (result !== '[') {
result = result.slice(0, -1);
}
result += ']';
return result;
case '[object Date]':
return '"' + (jsonObj.toJSON ? jsonObj.toJSON() : jsonObj.toString()) + '"';
case '[object RegExp]':
return "{}";
case '[object Object]':
result += '{';
for (i in jsonObj) {
if (jsonObj.hasOwnProperty(i)) {
curVal = JSON.stringify(jsonObj[i]);
if (curVal !== undefined) {
result += '"' + i + '":' + curVal + ',';
}
}
}
if (result !== '{') {
result = result.slice(0, -1);
}
result += '}';
return result;
case '[object String]':
return '"' + jsonObj.toString() + '"';
case '[object Number]':
case '[object Boolean]':
return jsonObj.toString();
}
}
};
}
/**********************************************json IE8*******************************************************/
</script>
<input type="file" id="excel-file" onchange="Export()" style="display:none"/>
<input type="button" value=" excel" id="tbn" onclick="uploads()"/>
<table id="tab" border="1"/>
</code></pre>
<p> </p>
</div>
</div>
</div>
</div>