Question

我是tinyMCE（以及JavaScript）的新手，所以如果我的问题的答案显而易见，我很抱歉。（我也在研究另一个开发人员创建的代码和文件，而且我并不太熟悉。）

我需要为tinyMCE4使用外部模板文件，我无法让它工作。我看过tinyMCE4文档，但我不明白我哪里出错了。

tinyMCE init位于index.cfm文件中，模板列表位于单独的文件template_list.js中。

template_list.js的内容：

var tinyMCETemplateList = [
 ["Name", "templates/file1.cfm", "Name."],
 ["Name2", "templates/file2.cfm", "Name2."],
...
];

在index.cfm中，我在插件行中包含了“template”。

要提取模板以在下拉列表中显示为列表，以便用户可以选择模板，我尝试过：

template_external_list_url: "tinymce/js/tinymce/template_list.js"

有了这个，当我运行程序并单击Insert Template按钮时，我得到一个“No templates defined”错误。

我也试过了：

templates : [{url:"tinymce/js/tinymce/template_list.js"}]

这样，将出现“插入模板”对话框，但下拉列表为空，并且template_list.js中的原始代码显示在下拉列表下的文本区域中。如果我将template_list.js中的代码更改为：

，我会得到相同的结果

[
 {title: "Name", url: "templates/file1.cfm", description: "Name."},
 {title: "Name2", url: "templates/file2.cfm", description: "Name2."},
...
]

...如果我在“title”，“url”和“description”周围添加引号。

再次，抱歉，如果答案很明显，但作为初学者，我感谢任何帮助。

Answer 1

根据文档，TinyMCE配置对象希望您传递包含每个模板的一个对象的数组。在高层次上它看起来像这样：

tinymce.init({
  selector: "textarea",  // change this value according to your HTML
  plugins: "template",
  menubar: "insert",
  toolbar: "template",
  templates: [
    {title: 'Item 1', description: 'Desc 1', content: 'My content'},
    {title: 'Item 2', description: 'Desc 2', url: 'development.html'}
  ]
});

您会注意到templates配置选项传递array objects - 这就是TinyMCE所期望的，无论您需要返回array objects。

您可以直接插入模板HTML（如上面的第一个示例所示），也可以指向初始化TinyMCE时浏览器可以获取的URL（如上面的第二个示例所示）。没有template_external_list_url配置选项，因此无效，因为它无效。

如果要在TinyMCE配置之外外化模板，可以将数据放在文件中并通过URL引用。例如：

tinymce.init({
  selector: "textarea",  // change this value according to your HTML
  plugins: "template",
  menubar: "insert",
  toolbar: "template",
  templates: "/path/to/the/file/templates.php"
});

在那里引用的网址必须返回array objects，因为这最终是TinyMCE所期待的。上面的例子似乎暗示你的外部文件正在返回一个名为tinyMCETemplateList的JavaScript变量 - 但这对TinyMCE没有任何意义，所以当文件可能被加载时，＆＃34;返回＆＃34;不是JavaScript对象的数组。

我建议你先开始工作而不要外化模板（只需确保你的基础工作正常）。然后将内容外部化为单独的文件，并确保该文件返回array objects。我会注意到，使用tinyMCETemplateList的示例似乎返回数组的数组，这不是TinyMCE所期望的。

Answer 2

我发现这真的很令人沮丧，而且很费劲。最后我正在做的是在另一个js文件中调用一个函数，该文件返回一个我给templates参数的数组。

function GetTemplateArray()
{
    return new Array(
        {
            title: "2 Columns",
            url: "templates/template1.html",
            description: "Adds a 2 column table"
        },
        {
            title: "3 Columns",
            url: "templates/scf/template2.html",
            description: "Adds a 3 column table"
        }
    );
}

然后在tinymce.init代码中：

    tinymce.init(
    {
    ...
        templates: GetTemplateArray(),
    ...

tinyMCE4无法使外部模板工作

2 个答案: