TinyMCE 4 中有没有办法在编辑时自动附加一个字符?

Is there a way in TinyMCE 4 to automatically append a character while editing?

这是 TinyMCE 4.3.13 中的问题,自 TinyMCE 4.1.3 以来新增。在我们的应用程序中,我们将 forced_root_block 设置为 false。当图像是页面上的最后一个元素时,如果您尝试删除它,您将得到:"Uncaught TypeError: Cannot read property 'nodeName' of null",除非它是页面上唯一的元素。

如果将其包裹在另一个元素中,则不会出现此错误,并且图像会被删除。如果图像后有任何其他项目,即使是单个字符,您也不会收到错误消息并且图像会被删除。

例如,如果您打开源代码并将其放入:

a <img src="http://ridgeaviation.ie/images/czaw-SportsCruiser-pic01.jpg"/>
b

然后您可以从 UI 中删除图像。

但是有了这个:

a <img src="http://ridgeaviation.ie/images/czaw-SportsCruiser-pic01.jpg"/>

你不能。

如果你把 " " 放在最后,你将无法删除,因为编辑器显然会修剪 space,但是如果你把 "‌" 放在最后,它就不会被修剪, 是看不见的,您可以删除图像。

这是html:

<!DOCTYPE html>
<html>
<head>
  <script src="//cdn.tinymce.com/4/tinymce.min.js"></script>
  <script>
tinymce.init({
    selector:'textarea',    toolbar: "fontselect fontsizeselect | bold italic underline| bullist numlist outdent indent | alignleft aligncenter alignright alignjustify | forecolor backcolor | link  anchor code",
    menubar: "edit insert view format table tools",
  plugins: [
    'advlist autolink lists link image charmap print preview hr anchor pagebreak',
    'searchreplace wordcount visualblocks visualchars code fullscreen',
    'insertdatetime media nonbreaking save table contextmenu directionality',
    'emoticons template paste textcolor colorpicker textpattern imagetools'
  ],
  image_advtab: true,
force_br_newlines: true,
force_p_newlines: false,
forced_root_block: false
  });
</script>
</head>
<body>
  <textarea>Easy (and free!) You should check out our premium features.</textarea>
</body>
</html>

所以问题是,有没有什么方法可以自动将“‌”附加到正在编辑的文本中,即使在使用“工具”->“源代码”进行编辑之后也是如此? TinyMCE 3.x 有 cleanup_callback,但在 4.x 中不可用。

您能否使用 TinyMCE change 事件并在末尾查找您的特殊字符,如果没有则添加它?

例如:

tinymce.init({
    selector: 'textarea',
    ...
    setup: function (editor) {
        editor.on('change', function () {
            console.log('Content changed to:  ' + editor.getContent());
            //Check the content here and add your character to the end if needed
        });
    }
})

这里是 fiddle 如何使用 change 事件... http://fiddle.tinymce.com/q0faab