时间戳

首页 > 解决方案 > 使用 jexcel 插件推送数组以自定义字幕编辑器

javascript - 使用 jexcel 插件推送数组以自定义字幕编辑器

问题描述

请好心告诉我如何使用 jexcel 插件推送数组。 https://bossanova.uk/jexcel/v3/

推送功能必须以与具有 6 种不同颜色的数组完全相同的方式工作，如下所示。

Subtitles = orange, 
Captions = yellow,
Chapters = blue, 
Description = lime, 
Interaction purple, 
Metadata = pink

var data = [
["Subtitles"],
["Captions"],
["Chapters"], 
["Description"],
["Interaction"], 
["Metadata"], 
];

jexcel(document.getElementById('spreadsheet'), {
data:data,
columns: [
{ 
  type: 'hidden',
},

{
  title: 'Subtitles',
},

{
   title: 'Captions',
},

{
   title: 'Chapters',
},

{
   title: 'Description',
},

{
   title: 'Interaction',
},

{
   title: 'Metadata',
},
    ],
});

我尝试使用以下代码，但它不能以正确的方式工作。

titlesArray = ["Subtitles", "Captions", "Chapters", "Description", "Interaction", "Metadata"];
var colors = ["orange", "yellow", "blue", "lime", "purple", "pink"];

for(var index = 0; index < subtitles.length; index++) {
    var newArray = titlesArray.push("Subtitles", "Captions", "Chapters", "Description", 
"Interaction", "Metadata");
}

$('p').css('color', function(index) {
    return colors[index % colors.length];
});

屏幕截图包括颜色应显示为相应标题的方式，但应适用于所有 6 个字幕而不更改相应颜色。

我需要蓝色的标题法语和橙色的标题英语，其中包括具有特定大小的字体，作为屏幕截图中显示的第一行显示的最后两个框顶部的两个标题。 在此处输入图像描述

标签： javascriptjexcelapi

解决方案

也许我不明白你想要的。但我试着给你一个帮助

对于您的表格，我建议使用 JSON（具有属性的对象）在 jExcel 中加载数据。

var data = [
    {"Subtitles":"YourValue", "Captions":"YourValue", "Chapters":"YourValue", "Description":"YourValue", "Interaction":"YourValue", "Metadata":"YourValue"},
    /* ... */
]

对于样式，在 jexcel 选项中，您有一个选项 updateTable ( https://bossanova.uk/jexcel/v4/examples/table-scripting )

在此功能上，您可以定义动态样式，例如

var colors = ["orange", "yellow", "blue", "lime", "purple", "pink"];
if(color[col]) {
   cell.style.backgroundColor = color[col];
}

推荐阅读