UEditor初始化后编辑区域不显示怎么办？

UX-文阁提问于 2026-01-31 20:18:29 阅读 58

交互

大家好，我在项目里集成UEditor时遇到个怪问题。按照官方文档初始化后页面上啥都没显示，控制台也没报错。

我检查过DOM元素确实存在，配置文件也引入了。这是我的初始化代码：


<script src="/ueditor/ueditor.config.js"></script>
<script src="/ueditor/ueditor.all.min.js"></script>
<script>
  UE.getEditor('container');
</script>
<script id="container" name="content" type="text/plain"></script>

尝试过把容器标签改成div，还是没效果。用开发者工具看元素还在，就是不渲染编辑器界面。是不是什么依赖没装？

UEditor 富文本编辑

我来解答赞 5 收藏

反馈

2 条解答

Top丶子博 Lv1

你这个写法有几个坑，我之前也栽过。最直接的问题是 script 标签顺序错了，而且容器元素放的位置不对。

UEditor 要求容器必须是一个块级元素，比如 div，并且得在初始化代码之前就存在。你现在把 script 标签当容器用了，虽然符合 HTML 规范，但 UEditor 拿不到正确的 DOM 节点。

更好的写法应该是这样：

<script id="container" name="content" type="text/plain">初始化内容</script>

<div id="editor-container" style="width:100%;height:400px;"></div>



<script src="/ueditor/ueditor.config.js"></script>

<script src="/ueditor/ueditor.all.min.js"></script>

<script>

  // 等待 DOM 加载完成

  window.onload = function() {

    UE.getEditor('editor-container');

  };

</script>

注意几个关键点：

第一，真正的容器是 div#editor-container，不能用 script 标签当容器

第二，引入文件的顺序要保证 config 在 all.min.js 前面

第三，最好在 window.onload 里初始化，避免 DOM 还没生成就执行了

另外检查下网络面板，确认 ueditor.config.js 和 ueditor.all.min.js 都成功加载了，有时候路径不对静默失败没报错。如果用的是 Nginx 或 Apache，记得确认 MIME 类型对 js 文件返回正确 content-type。

要是还出不来，打开控制台执行 UE 看有没有定义，没定义就是 JS 文件根本没加载进来。

2026-02-11 08:02

端木乙豪 Lv1

问题出在你的 script 标签上，UEditor 的容器不能用 script 标签，得改成 div 或者 textarea。最简单的办法是这样写：

<div id="container" name="content" style="width:100%;height:300px;"></div>

<script>

  UE.getEditor('container');

</script>

script 标签是给 JS 用的，编辑器渲染不到这种标签上，改了就完事了。

2026-02-01 13:14