HTML 提交表单时加载到 tinymce 中的标记未保存

Question

在 Google 网络应用程序中，加载到 tinymce 内联编辑器中进行编辑的电子表格中的 HTML 标记显示正确，但在提交表单时未保存。

我正在将标记加载到一个隐藏的文本区域，然后将该内容插入到我为tinymce 内联编辑器。（如果我将标记文本直接放在 DIV 中，它会被保存为文字文本，而不是解释为 html）。我将相同的内容保存到 tinymce 为编辑器输入创建的隐藏输入元素的内部 HTML——div 的 ID 被 tinymce 用作隐藏输入元素的名称。

这里是 javascript 代码：

window.addEventListener('load', (event) =>{
  var x, i;
x = document.querySelectorAll(".divEdit");
 for (i = 0; i < x.length-1; i++) {
 var tid=x[i].id; //get ID of each DIV which also is NAME of associated tinymce hidden input
 var hid="h"+tid; //ID of my hidden textarea paired with the DIV
 var htm=document.getElementById(hid).value; //hidden textarea holding HTML markup
 document.getElementById(tid).innerHTML=htm; //set DIV innerHTML as the html markup 
 var tEle=document.getElementsByName(tid)[0]; //the hidden input element created by tinymce

//method A -- appears to work, but content not saved on form submit:
tEle.innerHTML = htm; //set hidden input value as the html markup to be edited.

在开发人员工具中查看时，这一切看起来都不错： screen capture from browser in developer tools, shows markup in Div and hidden input element

但是在保存表单的时候，none的tinymce编辑器中的内容被保存了-- 但是，如果我不清除表单，而是再次重新提交表单，则标记已正确保存！

我还尝试在循环中使用 tinymce 方法将 html 标记保存到 Div：tinymce.get(tid).getBody() .innerHTML = htm;虽然这行得通，但 tinymce 并没有负责将标记从编辑器 Div 保存到它的隐藏输入中。

基本上，在手动激活编辑器实例之前，tinymce 似乎不会参与（初始化？）导入的内容。我尝试在加载时初始化 tinymce，这确实激活了编辑器界面的所有实例，但仍然没有在第一次提交表单时捕获 html 标记，至少我尝试的方式是这样。这是一个问题，因为可以编辑表单中的非 html 元素，而所有 html 元素保持不变。

我需要做哪些不同的事情？非常感谢您的任何见解。

Answer 1

经过进一步实验，javascript解法如下：

window.addEventListener('load', (event) =>{

var x, i;

  x = document.querySelectorAll(".divEdit");

  for (i = 0; i < x.length-1; i++) {

  var tid=x[i].id;

  var hid="h"+tid;

  var htm=document.getElementById(hid).value;

   tinymce.get(tid).getBody().innerHTML = htm;

  }

tinymce.triggerSave();

}

HTML 提交表单时加载到 tinymce 中的标记未保存

HTML markup loaded into tinymce not saving when form submitted

javascript

tinymce

tinymce-5