SpreadJS是一款功能强大的JavaScript控件,开发人员可以利用该产品快速创建出跨平台、浏览器的表格应用程序,下面简单介绍如何使用该产品创建一个空白表格,具体步骤如下:
1. Spread 初始化需要以下文件:
gcSpread.sheets.x.xx.xxxxx.x.css
jquery-1.8.2.min.js
gcSpread.sheets.all.x.xx.xxxxx.x.min.js
2. 将 gcSpread.sheets.x.xx.xxxxx.x.css, jquery-1.8.2.min.js, 以及 gcSpread.sheets.all.x.xx.xxxxx.x.min.js 文件加入到 HTML 文档 Head 部分并给予其对应路径。此外, SpreadJS 还依赖第三方 jQuery 类库。例如:
<!DOCTYPE html>
<html>
<head>
<link href='gcSpread.sheets.x.xx.xxxxx.x.css' rel='stylesheet' type='text/css'/>
<script src='jquery-1.8.2.min.js' type='text/javascript'></script>
<script src='gcSpread.sheets.all.x.xx.xxxxx.x.min.js' type='text/javascript'></script>
<script type='text/javascript' charset='utf-8'>
...
</script>
</head>
<body>
<div id='ss' style='width:100%; height:400px;'></div>
</body>
</html>
3. Spread 控件通过 new GcSpread.Sheets.Spread(document.getElementById('ss'), { sheetCount: 1 }) 函数进行初始化, 并且 Spread ( 以下简称 SpreadJS 控件为 'Spread') 被添加到 id 为 'ss' 的 Div 元素中。你可以通过函数 var Spread = $('#ss').data('Spread') 获取 Spread对象实例。然后, 你就可以定制你的 Spread 了。 例如:
$(document).ready(function () {
var Spread = new GcSpread.Sheets.Spread(document.getElementById('ss'), { sheetCount: 1 });
// get Spread object
// var Spread = $('#ss').data('Spread');
});