0

我有多个要使用 tinyMCE 增强的文本区域。我可以通过在页面中的所有文本区域上初始化 TinyMCE 来将文本区域显示为富文本编辑器,如下所示:

$(function () {
    tinymce.init({
        selector: "textarea",
        statusbar: false,
        setup: function (editor) {
            editor.on('change', function () {
                editor.save();
            });
        }
    });
});

这也处理 Tiny 编辑器和实际文本区域之间的同步过程。

填充文本区域的我的 html 如下所示:

<div id="divEditor1" class="container-fieldset">
    <div class="editor-label-field" style="left: 50px">
        <%:Html.LabelFor(Function(model) model.divEditor1, "divEditor1")%>
    </div>
    <div class="editor-field-fn">
        <%:Html.TextBoxFor(Function(model) model.divEditor1,  New With { Key .class = "ucase-input" } )%>
        <%:Html.ValidationMessageFor(Function(model) model.divEditor1)%>
    </div>
</div>
    <div id="divEditor2" class="container-fieldset">
    <div class="editor-label-field" style="left: 50px">
        <%:Html.LabelFor(Function(model) model.divEditor2, "divEditor2")%>
    </div>
    <div class="editor-field-fn">
        <%:Html.TextBoxFor(Function(model) model.divEditor2,  New With { Key .class = "ucase-input" } )%>
        <%:Html.ValidationMessageFor(Function(model) model.divEditor2)%>
    </div>
</div>
... etc

我可以像这样阅读 TinyMCE 编辑器的内容:

for (var i = 0; i < numberOfEditors; i++) {           
    sFieldValue = document.getElementById("FormFieldText" + i).value;
    //sFieldValue = tinyMCE.get("FormFieldText" + i).getContent(); -> or like this, works just as well.
};

我遇到的问题是让 TinyMCE 编辑器框在页面加载时显示已经存在的文本(从数据库读取的文本),因为它总是显示为空文本框。但是,文本在后台的原始文本区域中正确导入。格式化和转义,因为它经历了一些 ajax 调用。

我已经看到我可以像这样设置 tiny 的内容:

tinyMCE.get('my_editor').setContent(data);

但是,我需要以编程方式执行此操作,以使页面上的所有文本区域都将信息导出为微小的。就像上面一样

setup: function (editor) {
    editor.on('change', function () {
        editor.save();
    });
    }

另外,什么时候是对文本进行解码的合适时间?(我认为这一步是必要的)

4

3 回答 3

0

我最终通过 ID 解析了活动 tinymce 实例的列表,并使用背景中 textareas 中的相应文本填充每个实例。

于 2019-01-10T13:59:29.523 回答
0

如果您textarea在每个都有其内容之前在每个上初始化 TinyMCE,textarea那么 TinyMCE 不会在内容更新时自动返回并更新自身textarea- 它只是不能那样工作。

获取数据后,您可以使用 TinyMCE API(正如您从帖子中知道的那样)来更新编辑器的内容。或者,您可以延迟初始化 TinyMCE,直到将数据提取到每个textarea.

两种方法都不是更好/更差 - 当然有多种方法可以解决这个问题,如果实施得当,它们都可以工作。

于 2019-01-03T21:20:14.563 回答
0

我遇到了这篇文章,正在寻找一种解决方案,将数据库中的数据恢复到 tinymce 中,最后我得到了

<textarea id="textarea"><?= htmlspecialchars($description); ?></textarea>

只需使用 php 和数据库中数组中的变量。

于 2021-11-02T11:03:17.093 回答