Page tree
Skip to end of metadata
Go to start of metadata

You are viewing an old version of this page. View the current version.

Compare with Current View Page History

« Previous Version 6 Next »

请按照以下步骤引入 Spread.Sheets 组件到您的浏览器页面

  1. 首先,创建一个新页面,并在页面上输入以下代码:

    HTML
    <!DOCTYPE html> 
    	<html> 
    	<head> 
     		<title>Spread HTML test page</title>
  2. 在页面中添加对 Spread.JS 的引用。代码如下。需要注意的是,Spread 提供压缩过(minified)的 JavaScript 文件和和用于调试的文件。

    HTML
    <script src="[Your_Scripts_Path]/gc.spread.sheets.all.xxxx.min.js" type="text/javascript"></script>
  3. 添加 CSS 文件以改变Spread.JS 的外观。默认的CSS文件名为: gc.spread.sheets.xxxx.css,里面包含了所有的默认样式。该 CSS 文件将会影响滚动条,筛选框及其子元素,单元格和下方标签栏的样式。引入 CSS 的代码如下:

    HTML
    //<link href="[Your_CSS_Path]/gc.spread.sheets.xxxx.css" rel="stylesheet" type="text/css"/>
    //OR
    <link href="[Your_CSS_Path]/bootstrap/bootstrap.min.css" rel="stylesheet" type="text/css"/>
    <link href="[Your_CSS_Path]/bootstrap/bootstrap-theme.min.css" rel="stylesheet" type="text/css"/>

//<link href="[Your_CSS_Path]/gc.spread.sheets.xxxx.css" rel="stylesheet" type="text/css"/>//OR<link href="[Your_CSS_Path]/bootstrap/bootstrap.min.css" rel="stylesheet" type="text/css"/><link href="[Your_CSS_Path]/bootstrap/bootstrap-theme.min.css" rel="stylesheet" type="text/css"/>


4. 添加产品序列号,代码为: GC.Spread.Sheets.LicenseKey = "xxx";

5. 添加控件初始化代码。本例会在一个 id 为“ss”的 DOM 元素上初始化 Spread.Sheets。

  1. JavaScript

    Copy Code

    <script type="text/javascript">
    // Add your license
    GC.Spread.Sheets.LicenseKey = "xxx";
    // Add your code
    window.onload = function(){
    var spread = new GC.Spread.Sheets.Workbook(document.getElementById("ss"),{sheetCount:3});
    var sheet = spread.getActiveSheet();
    }
    </script>
    </head>
    <body>

    6. 创建一个 id 为 “ss”的元素,Spread.Sheets 将在该 DOM 中初始化。

    JavaScript

    Copy Code

    <div id="ss" style="height: 500px; width: 800px"></div>
    </body>
    </html>

    <!DOCTYPE html> is required to view the widget properly.

  • No labels