富文本编辑器-UEditor的基本配置

最新推荐文章于 2025-09-15 14:04:12 发布

原创最新推荐文章于 2025-09-15 14:04:12 发布 · 970 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#html #javascript

web 专栏收录该内容

18 篇文章

订阅专栏

本文详细介绍了如何下载并配置UEditor编辑器的步骤。包括指定版本的下载链接、解压后的配置流程、解决常见错误的方法及最终实现编辑器正常运行的全过程。

下载地址：https://github.com/fex-team/ueditor#ueditor
以dev-1.5.0版本为例。

解压后可以看到有个demo.html文件，但是打开发现并不能运行。

配置如下：
1、导入根目录中ueditor.config.js
2、导入_examples目录中的editor_api.js
这时打开demo.html可以看到还是报错，而控制台报的是一堆js文件找不到异常。
3、打开_examples/editor_api.js文件可以翻到最后将baseURL后的值改为'_src/'。
上面的异常就可以解决了。
重新刷新页面，就可以看到Editor页面出来了。

demo.html页面内容

<!DOCTYPE HTML>
<html lang="en-US">
<head>
    <meta charset="UTF-8">
    <title>ueditor demo</title>
</head>
<body>
<!-- 加载编辑器的容器 -->
<script id="container" name="content" type="text/plain">这里写你的初始化内容</script>
<!-- 配置文件 -->
<script type="text/javascript" src="ueditor.config.js"></script>
<!-- 编辑器源码文件 -->
<script type="text/javascript" charset="utf-8" src="_examples/editor_api.js"> </script>
<!-- 实例化编辑器 -->
<script type="text/javascript">
    var ue = UE.getEditor('container');
</script>
</body>
</html>