如何使用tinymce，在富文本编辑器中插入图片

使用tinymce插入图片可以通过以下步骤完成：

1. 在HTML页面中添加tinymce插件，并定义一个textarea元素作为富文本编辑器，例如：

<script src="https://cdn.tiny.cloud/1/no-api-key/tinymce/5/tinymce.min.js"></script>
<script>
  tinymce.init({
    selector: 'textarea',
    plugins: 'image',
    toolbar: 'image'
  });
</script>

<textarea></textarea>

2. 在tinymce中点击图片按钮，并选择上传方式。

3. 上传图片并等待图片上传完成。

4. 选择上传完成的图片，点击“插入”按钮。

5. 图片将被插入到富文本编辑器中。

你还可以通过设置tinymce的配置项来定制上传图片的行为，比如设置图片上传路径、大小限制等。更多详情可以参考tinymce官方文档。

相关问题

tinymce富文本编辑器插入图片后取消默认选择

要取消默认选择插入图片后自动选中该图片，可以通过以下步骤实现：

1. 打开 tinymce 的配置文件，一般为 tinymce.init({})。

2. 在配置文件中添加以下代码：

setup: function(editor) {
  editor.on('ObjectResized', function(e) {
    e.target.selection.select(e.target.getBody().getElementsByTagName('img')[0]);
  });
}

3. 保存配置文件并重新加载页面，插入图片后就不会默认选择该图片了。

这段代码的作用是在插入图片并调整大小后，取消自动选择该图片，避免用户误操作。

vue2中tinymce富文本编辑器插入图片后取消默认选择

在Vue2中使用tinymce富文本编辑器插入图片后，默认会选择插入的图片，如果需要取消默认选择，可以在插入图片的回调函数中，设置选中的内容为空。具体代码如下：

// 初始化tinymce
tinymce.init({
    selector: 'textarea',
    plugins: 'image',
    toolbar: 'image',
    height: 500,
    setup: function (editor) {
        // 插入图片的回调函数
        editor.on('insertedContent', function (e) {
            // 获取插入的图片
            var img = e.target.querySelector('img');
            if (img) {
                // 取消默认选择
                editor.selection.select(img);
                editor.selection.collapse();
            }
        });
    }
});

在插入图片的回调函数中，首先获取插入的图片，然后将选中的内容设置为空，即取消默认选择。