使特定的 TinyMCE TextArea 只读或设计

Make Specific TinyMCE TextArea ReadOnly or Design

我有一个包含多个 textarea 字段的 Razor 页面。在我使用 TinyMCE 之前,我使用以下 Javascript 到 enable/disable 基于复选框选择的特定 textarea

 if ('@Model.IssueData.rootCauseIdentified' == "true") {
      document.getElementById("rootcause").disabled = false;
      document.getElementById("rootcause").style.backgroundColor = "white";
 } else {
      document.getElementById("rootcause").style.backgroundColor = "lightgray";
 }

我现在已经将 textarea 转换为使用 TinyMCE。我如何将这一项 textarea 改为 enable/disable 呢?我已经创建了 2 个初始部分,其中 1 个目标是除了我想更改的单个 textarea

tinymce.init({
    selector: '.tinymce1',
    menubar: false,
    plugins: [
        'advlist autolink lists link charmap',
        'searchreplace',
        'insertdatetime table paste wordcount'
    ],
    toolbar: 'undo redo | ' +
        'bold italic underline forecolor backcolor | alignleft aligncenter ' +
        'alignright alignjustify | bullist numlist outdent indent |link charmap ' +
        'removeformat'
});
tinymce.init({
    selector: '.toenabledisable',
    menubar: false,
    plugins: [
        'advlist autolink lists link charmap',
        'searchreplace',
        'insertdatetime table paste wordcount'
    ],
    toolbar: 'undo redo | ' +
        'bold italic underline forecolor backcolor | alignleft aligncenter ' +
        'alignright alignjustify | bullist numlist outdent indent |link charmap ' +
        'removeformat'
});

我遇到了以下代码,但不知道如何修改它以仅针对我想要的 textarea(特别是 tinymce.activeEditor.mode.set 部分)。

function toggleEditorMode(mode) {
if (mode) {
  tinymce.activeEditor.mode.set("design");
} else {
  tinymce.activeEditor.mode.set("readonly");
}

编辑:解决方案 根据下面的评论,我能够想出以下对我有用的代码:

if (elementid == "rootcause") {              
    if (element.checked) {
        tinymce.get('rootcause').mode.set("design");
    } else {                   
        tinymce.get('rootcause').mode.set("readonly");
    }
}

当你想定位一个特定的编辑器实例时,你可以使用 tinymce.get() API 通过底层文本区域的 ID 来定位一个:

https://www.tiny.cloud/docs/api/tinymce/root_tinymce/#get

您还可以使用 tinymce.editors 获取所有编辑器的数组。这将为您提供页面上所有实例化编辑器的数组。