制作一个类似excel表格 html,类似Excel的jquery/VUE电子表格插件jExcel(推荐)

jexcel.js是一款轻量级的类似Excel的jquery电子表格插件，作者还兼容了VUE。你可以同js数组、json数据或CSV或XSLX文件创建在线电子表格表，你甚至可以直接从一个Excel表格中直接复制粘贴数据到jexcel表格中，用于创建与Excel或任何其他电子表格软件兼容的基于Web的交互式表格和电子表格 。

很容易集成任何第三方的javascript插件来创建您自己的自定义列、自定义编辑器，并自定义应用程序中的任何功能。Jexcel通过其本机列类型具有许多不同的输入选项，以满足最常见的基于Web的应用程序需求。它是一个完整的Web数据管理解决方案。使用jexcel javascript电子表格创建令人惊叹的应用程序。

主要优势

制作丰富且用户友好的Web界面和应用程序

您可以以使用用户的方式轻松处理复杂的数据输入

改善用户软件体验

创建丰富的cruds和漂亮的用户界面

与Excel的兼容性：用户可以使用常见的复制粘贴快捷方式移动数据

通过第三方插件集成轻松定制

精益、快速、简单易用

数千个成功的用户案例

在基于Web的软件中加快处理困难数据输入的工作速度

var data = [

['Jazz', 'Honda', '2019-02-12', '', true, '$ 2.000,00', '#777700'],

['Civic', 'Honda', '2018-07-11', '', true, '$ 4.000,01', '#007777'],

];

jexcel(document.getElementById('spreadsheet'), {

data:data,

columns: [

{ type: 'text', title:'Car', width:120 },

{ type: 'dropdown', title:'Make', width:200, source:[ "Alfa Romeo", "Audi", "Bmw" ] },

{ type: 'calendar', title:'Available', width:200 },

{ type: 'image', title:'Photo', width:120 },

{ type: 'checkbox', title:'Stock', width:80 },

{ type: 'numeric', title:'Price', width:100, mask:'$ #.##,00', decimal:',' },

{ type: 'color', width:100, render:'square', }

]

});

var options = {

data:[[]],

minDimensions:[10,10],

}

var vm = new Vue({

el: '#spreadsheet',

mounted: function() {

let spreadsheet = jexcel(this.$el, options);

Object.assign(this, spreadsheet);

}

});

相关链接