jquery - 在 bootstrap 模态中填充 tinymce 中的数据

jquery - populate data in tinymce inside a bootstrap modal

我正在开发一个 laravel 5.4 应用程序,其中包含 tinymce 插件以添加内容。这工作正常。然后将此内容保存在数据库中并列在 html table 上,并且可以编辑或删除(正常 crud)

问题出在单击编辑按钮时,弹出模式,但带有 tinymce 内容的文本区域是空白的。下面是处理这个位的 jquery 以及处理 tinymce 的函数:

$(function(){
    $('.edit-subchapter').on('click', function(){
        var id = $(this).attr("value");
        $.get('subchapters/edit/'+id, function(response){
           for (var i in response) 
            {
                console.log(response[i].content);
                $("#formEdit #content").val(response[i].content);
            }
        },'json');
    });
});

var editor_config = {
path_absolute : "{{URL::to('/')}}/",
selector      : "textarea",
plugins: [
  "advlist autolink lists link image charmap hr anchor pagebreak",
   "insertdatetime media nonbreaking save table contextmenu directionality"
],
menubar: false,
toolbar: "insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image media"
};

tinymce.init(editor_config);

奇怪的是我的 console.log(response[i].content); 正在从数据库返回数据,所以我知道该位正在工作

问题出现在传递到文本区域时:$("#formEdit #content").val(response[i].content);,没有任何显示。所以据我所知这是一个 tinymce 问题?可能是什么问题?

好的。我想到了。在 tinymce 中设置值时,我们不使用 html 控件,因为 tinymce 在运行时替换了文本区域。

所以不是这个:

$("#formEdit #content").val(response[i].content);

我们将有这个:

tinymce.get('content').setContent(response[i].content);

并在 tinymce 中编辑值后,捕获该值,而不是:

$("#formEdit #content").val();

我们将有:

tinymce.get('content').getContent();

这里有一些不错的参考站点:

http://archive.tinymce.com/wiki.php/TinyMCE3x:How-to_load/save_with_Ajax_in_TinyMCE

https://forums.asp.net/t/1825756.aspx?Set+value+of+textarea+tinymce+in+jQuery+

希望这对遇到类似问题的人有所帮助