Jspreadsheet v4:JavaScript 电子表格

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 许可下发布的。

扫描二维码关注公众号,回复: 13391708 查看本文章

猜你喜欢

转载自blog.csdn.net/allway2/article/details/121457226
今日推荐