tinymce - Tinymce 仅作为文本编辑器，不编辑 html

Question

我有一个复杂的布局，不希望客户能够把它搞砸并最终破坏它。所以我想限制tinymce，以便他们只能编辑/更改文本。

• 不允许对布局进行任何更改
• 除文本外，不得添加/删除任何内容
• 从字面上看，他们所能做的就是更改文本。

这可能吗？

Answer 1

我会说：“是的，这是可能的，这取决于您认为用户可能会执行哪种操作。”

我假设您的布局以 html 代码的形式存在，并且可以在编辑器中找到。现在，当用户开始选择和删除时 - 这就是您必须介入的地方。您可以编写自己的插件（或带有 onKeyUp 处理程序的合适的设置配置参数）来检查您的任何有价值的布局元素是否消失了。如果是这种情况，您将需要修复它。您还可以检查键码（ctrl+x、DELTE、Backspace 等）。复制到编辑器也需要限制为文本（关于这个问题有几个 SO 问题）。

Answer 2

TinyMce 有一个插件。它被称为不可编辑： https : //www.tinymce.com/docs/plugins/noneditable/

您可以像这样启动tinymce：

tinymce.init({
    selector: 'texteditor',  // change this value according to your HTML
    toolbar: 'undo redo', // disable most of the plugins ...
    context_menu: false,
    menubar: false,        // ... to allow text edit only
    noneditable_editable_class: "editable", // class allowed to edit
    noneditable_noneditable_class: "non_editable" // the parent (everything else)

});

您必须定义这两个属性 - 我只尝试使用noneditable_editable_class计数它将把其余的视为不可编辑 - 没有成功。

另一个解决方案（没有 tinyMce）将contenteditable属性放置在您希望被允许编辑的页面元素上：

$('.editable').attr('contenteditable','true');