Question

我在我的网站上设置了tinymce，以便用户可以在编写文本时使用工具栏以及上传图片。不幸的是，我已经意识到与tinymce有关的问题。

$(document).ready(function() {
 tinymce.init({
 selector: "#market-product_info, #market-delivery_info, #market-facility_info",
 language_url: '/frontend/web/js/tinymce/langs/zh_CN.js',
 menubar:true,
 statusbar: true,
 relative_urls : false,
 branding: false,
 plugins: [
           "advlist autolink lists link image charmap print preview hr anchor pagebreak",
           "searchreplace wordcount visualblocks visualchars code fullscreen",
           "save table contextmenu directionality emoticons template paste textcolor",
           "emoticons template paste textcolor colorpicker textpattern",
           "save"
 ],
  toolbar1: "undo redo | bold italic underline | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | forecolor |styleselect | link unlink anchor |link image | preview code ",
  image_advtab: true,   
  // enable title field in the Image dialog


 image_title: true, 
  // enable automatic uploads of images represented by blob or data URIs
  automatic_uploads: true,
  // URL of our upload handler (for more details check: https://www.tinymce.com/docs/configure/file-image-upload/#images_upload_url)
  // images_upload_url: 'postAcceptor.php',
  // here we add custom filepicker only to Image dialog
  file_picker_types: 'image', 
  // and here's our custom image picker
  file_picker_callback: function(cb, value, meta) {
    var input = document.createElement('input');
    input.setAttribute('type', 'file');
    input.setAttribute('accept', 'image/*');

    // Note: In modern browsers input[type="file"] is functional without 
    // even adding it to the DOM, but that might not be the case in some older
    // or quirky browsers like IE, so you might want to add it to the DOM
    // just in case, and visually hide it. And do not forget do remove it
    // once you do not need it anymore.

    input.onchange = function() {
      var file = this.files[0];

      var reader = new FileReader();
      reader.onload = function () {
        // Note: Now we need to register the blob in TinyMCEs image blob
        // registry. In the next release this part hopefully won't be
        // necessary, as we are looking to handle it internally.
        var id = 'blobid' + (new Date()).getTime();
        var blobCache =  tinymce.activeEditor.editorUpload.blobCache;
        var base64 = reader.result.split(',')[1];
        var blobInfo = blobCache.create(id, file, base64);
        blobCache.add(blobInfo);

        // call the callback and populate the Title field with the file name
        cb(blobInfo.blobUri(), { title: file.name });
      };
      reader.readAsDataURL(file);
    };
    input.click();
  }
  });   
});

问题是当用户创建表格或使用任何工具栏选项（粗体，斜体，文本颜色等）并提交时，在数据库中信息是在用户插入时接收的，但是如果用户想要编辑信息并重新提交，然后在textarea中显示所有单词没有任何表或任何工具栏功能。如果他/她想要编辑文本，我希望用户能够找到他/她之前提交的文本。

Answer 1

您是否尝试创建textarea：

<textarea style="width: 100%;" name="description" id="description"></textarea>

然后设置textarea的内容：

$('#description').html('<table><tr><th>user info table</th></tr></table>');

然后初始化tinyMCE：

tinyMCE.init({
    // input tinyMCE options
    ...
});

Tinymce没有保存提交的文本

1 个答案: