富文本编辑框之不可编辑

最新推荐文章于 2025-06-20 09:40:24 发布

原创

最新推荐文章于 2025-06-20 09:40:24 发布 · 7.3k 阅读

0 ·

CC 4.0 BY-SA版权

本文介绍如何在富文本编辑框中处理不可编辑的内容，尤其是图片上传替换URL的细节。通过前端Vue.js代码和JS事件监听，实现粘贴时自动处理文章内图片并上传到OSS。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

样式：(用于过滤图文中的图片替换url)

前端代码：

                            <!-- 加载编辑器的容器 -->
                            <div class="form-group">
                                <label for="container"  for="container">文 章 内 容</label>
                                <div>
                                    <div id="container"
                                         style="min-height: 100px; border: 2px solid #d6dbdc;">
                                    </div>
                                </div>
                            </div>
                            <!-- 文章 start -->
                            <div class="form-group hidden">
                                <div class="col-sm-offset-4 col-sm-6">
                                    <input t