项目中IOS显示xls和xlsx很容易,使用下面代码就可以,但是安卓比较麻烦,为了统一处理,选择excel保存csv来解析显示表格。
//https://developer.apple.com/library/ios/qa/qa1630/_index.html
func loadDocument(documentName:String, webView:UIWebView)
{
let path:String = NSBundle.mainBundle().pathForResource(documentName, ofType: nil)!;
let url:NSURL = NSURL(fileURLWithPath: path)
let request:NSURLRequest = NSURLRequest(URL: url)
webView.loadRequest(request)
}
使用d3.js来解析服务器的csv文件,不过d3解析出来的是key-value的数组,由于内容是变化的,所以我直接使用了返回值,然后自己解析
function response(request) {
return request.responseText;//dsv.parse(request.responseText);
}
有一个问题就是如果不处理的话转出来的csv文件是ansi编码的js直接获取是乱码,所以使用d3的时候需要设置,如下:
function callPase(){
var csv = d3.dsv(",", "text/csv;charset=gb2312");
csv("http://7xnhdv.com1.z0.glb.clouddn.com/test.csv",function(error,csvdata){
genTable(csvdata);
});
}
获取到数据后使用getTable方法解析来生成表格
function genTable(param){
var isarray=param instanceof Array;
var html = "";
var data=null;
if(isarray){//数组直接用
data=param;
}else{//csv字符串则转为数组
data=new Array();
var lines=param.split('\r\n');
for(var i=0;i<lines.length;i++){
var cells=lines[i].split(',');
data.push(cells);
}
}
var Table = document.getElementById("tableId");
for(var i=0;i<data.length;i++){
var NewRow = Table.insertRow(); //添加行
var cells=data[i];
for(var j=0;j<cells.length;j++){
var NewCell= NewRow.insertCell();
NewCell.innerHTML = cells[j];
NewCell.style.height = "20px";
}
}
}
效果如下:
完整地html代码:
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" href="bootstrap.css"/>
<style>
/* 单元格对齐 */
td{
text-align:center;
}
</style>
<script src="jquery.min.js"></script>
<script src="bootstrap.js"></script>
</head>
<body οnlοad="callPase()">
<div class="panel panel-default">
<table id="tableId" class="table">
</table>
</div>
</body>
<script type="text/javascript" src="d3.js"></script>
<script type="text/javascript">
function callPase(){
var csv = d3.dsv(",", "text/csv;charset=gb2312");
csv("http://7xnhdv.com1.z0.glb.clouddn.com/test.csv",function(error,csvdata){
genTable(csvdata);
});
}
function genTable(param){
var isarray=param instanceof Array;
var html = "";
var data=null;
if(isarray){//数组直接用
data=param;
}else{//csv字符串则转为数组
data=new Array();
var lines=param.split('\r\n');
for(var i=0;i<lines.length;i++){
var cells=lines[i].split(',');
data.push(cells);
}
}
var Table = document.getElementById("tableId");
for(var i=0;i<data.length;i++){
var NewRow = Table.insertRow(); //添加行
var cells=data[i];
for(var j=0;j<cells.length;j++){
var NewCell= NewRow.insertCell();
NewCell.innerHTML = cells[j];
NewCell.style.height = "20px";
}
}
}
</script>
</html>