Jexcel已重命名为Jspreadsheet。
Jspreadsheet 是一个轻量级的 vanilla javascript 插件,用于创建与其他电子表格软件兼容的令人惊叹的基于 Web 的在线交互式表格和电子表格。您可以从 JS 数组、JSON、CSV 或 XSLX 文件创建在线电子表格。您可以从 Excel 复制并直接粘贴到您的在线电子表格,反之亦然。很容易集成任何第三方 javascript 插件来创建您自己的自定义列、自定义编辑器,并将任何功能自定义到您的应用程序中。Jspreadsheet 通过其原生列类型提供了大量不同的输入选项,以涵盖最常见的基于 Web 的应用程序需求。它是一个完整的网络数据管理解决方案。使用 Jspreadsheet 创建令人惊叹的在线电子表格。
只需几个简单的步骤,您就可以将 Jspreadsheet 集成到您的应用程序中。使用这个惊人的数据交互工具,以更好的用户体验打动您的客户。
- 制作丰富且用户友好的 Web 界面和应用程序
- 您可以以用户习惯的方式轻松处理复杂的数据输入
- 改善您的用户软件体验
- 创建丰富的 CRUDS 和漂亮的 UI
- 与 Excel 电子表格的兼容性:用户可以使用常见的复制和粘贴快捷方式移动数据
- 通过简单的第三方插件集成轻松定制
- 精益、快速且易于使用
- 上千个成功用户案例
- 加快您在基于 Web 的软件中处理困难数据输入的工作
- 创建和共享惊人的在线电子表格
安装
npm install jspreadsheet-ce
或从我们的Github 官方下载
创建惊人的在线电子表格
如何在您的应用程序中嵌入一个简单的 javascript 电子表格的示例。您可以在此处查看更多示例。
Car | Make | Available | Photo | Stock | Price | G | |
1 | Jazz | Honda | 12/02/2019 | ![]() |
$ 2.000,00 | ||
2 | Civic | Honda | 11/07/2018 | $ 4.000,01 |
<html>
<script src="https://bossanova.uk/jspreadsheet/v4/jexcel.js"></script>
<link rel="stylesheet" href="https://bossanova.uk/jspreadsheet/v4/jexcel.css" type="text/css" />
<script src="https://jsuites.net/v4/jsuites.js"></script>
<link rel="stylesheet" href="https://jsuites.net/v4/jsuites.css" type="text/css" />
<div id="spreadsheet"></div>
<script>
var data = [
['Jazz', 'Honda', '2019-02-12', '', true, '$ 2.000,00', '#777700'],
['Civic', 'Honda', '2018-07-11', '', true, '$ 4.000,01', '#007777'],
];
jspreadsheet(document.getElementById('spreadsheet'), {
data:data,
columns: [
{
type: 'text',
title:'Car',
width:90
},
{
type: 'dropdown',
title:'Make',
width:120,
source:[
"Alfa Romeo",
"Audi",
"Bmw",
"Chevrolet",
"Chrystler",
// (...)
]
},
{
type: 'calendar',
title:'Available',
width:120
},
{
type: 'image',
title:'Photo',
width:120
},
{
type: 'checkbox',
title:'Stock',
width:80
},
{
type: 'numeric',
title:'Price',
mask:'$ #.##,00',
width:80,
decimal:','
},
{
type: 'color',
width:80,
render:'square',
},
]
});
</script>
</html>
Javascript 电子表格示例
- 从 HTML 表
创建一个关于如何从 HTML 表创建动态 jspreadsheet 表的完整示例。 - 使用选项卡在选项卡中对
多个电子表格进行分组。 - 表格页脚上的公式 添加固定在表格页
脚上的公式。 - React 实现
关于如何将 Jspreadsheet 与 React 集成的完整示例 - VUE 实现
关于如何将 Jspreadsheet 与 Vue 集成的完整示例 - Angular 实现
关于如何将 Jspreadsheet 与 Angular 集成的完整示例 - Jquery 实现
关于如何将 Jspreadsheet 与 Jquery 集成的完整示例 - 搜索和分页带有搜索和分页的
完整电子表格示例,为喜欢数据表的人带来了极大的兼容性。 - 列类型
了解有关强大列类型的更多信息。此示例包含所有本机列类型以及如何创建您自己的自定义类型。 - 高级下拉菜单关于如何处理简单、高级、多重、自动完成和条件下拉菜单的
完整示例。使用下拉列表中的类别和图像创建惊人的 javascript 表格。 - 日期和日期时间选择器从基本到高级日历用法、日期和日期时间选择器的
示例 - 图片
此示例展示了如何将图片嵌入和上传到您的电子表格 - Richtext 列此示例显示如何创建Richtext
列 - 以编程方式更新
如何通过 javascript 更新电子表格及其数据 - 表格样式
为自定义 javascript 电子表格的应用程序带来非常特殊的触感。 - 表脚本
使用 javascript 自定义表行为 - 事件
了解如何处理 Jspreadsheet 上的事件 - 导入数据
如何从外部 CSV、json 文件或 XLSX 导入数据。 - 公式
释放表格的力量,在 Jspreadsheet 电子表格中引入公式和自定义 javascript 方法。 - 自定义工具栏关于如何启用或自定义您的 javascript 电子表格工具栏的
完整示例。 - 单元格注释
允许在表格电子表格中添加注释。 - 标题
标题更新和列拖动 - 嵌套头
启用嵌套头在电子表格中,并学习如何设置或获取标题值 - 列拖拽
启用列拖拽 - 翻译
如何从 Jspreadsheet 翻译默认消息 - 元信息
使用元信息方法保留有关您的细胞的隐藏信息 - 合并单元格关于如何处理 javascript 表中合并单元格的
完整示例。 - 排序列
示例如何通过javascript按列对表进行排序。 - 只读列
示例如何设置只读单元格 - 延迟加载
这个例子带来了一个非常好的特性来处理大表数据集。 - Custom Contextmenu
如何自定义jspreadsheet contextmenu - 表格溢出
如何为jspreadsheet 表格定义固定的宽度和高度。 - 列过滤器
如何在 Jspreadsheet 上启用列过滤器 - 在线电子表格。 - 冻结列
在Jspreadsheet设置冻结列
版权和许可
Jspreadsheet 是在 MIT 许可下发布的。