推荐两款在线文本编辑器

最新推荐文章于 2024-10-29 09:54:14 发布

代号陈

最新推荐文章于 2024-10-29 09:54:14 发布

阅读量2.2k

点赞数

分类专栏： php js 文章标签：在线文本编辑器 ueditor_mini部署 kindeditor上传路径 ueditor上传路径 UBB

本文链接：https://blog.csdn.net/qiexh/article/details/20791357

版权

js 同时被 2 个专栏收录

10 篇文章 0 订阅

订阅专栏

php

8 篇文章 0 订阅

订阅专栏

推荐两款在线文本编辑器

做博客或论坛系统的时候用的上的。我这里是以php为例子的

一 kindeditor

之前，我是用 kindeditor 的，很好很强大。部署简单、支持文件上传等，。怎么用？在安装包的demo文件里面都有很详细的例子了，我就不赘述了。下面只看两个别人很少说到的问题。

/php/upload_json.php -- 对上传的文件进行设置，包括路径设置、文件名设置等。

/php/file_manager_json.php -- 把远程文件抓取到本地

上面两个文件都有下面这两条语句：

//文件保存目录路径：上传的文件就保存在这个目录里
$save_path = $php_path . '../attached/';
//文件保存目录URL：上传的文件返回的URL就是这个，然后我们拿到这个URL进行各种操作，包括写入数据库
$save_url = $php_url . '../attached/';

我们只需要改那两个文件的这些语句就可以设置文件上传路径了。另外，这里用的是相对于站点的路径的

二 UEditor

在我看来，它有三个版本：①UE完整版、②UM迷你版、③UB定制版

以前我也下载过，那时候的安装包里面没有demo文件，我也没深入研究，所以那时候不会用。今天试了一下，UE完整版和UB定制版的安装包里面都有很好的demo文件，用起来很简单。而它的官网里面也有部署说明，另外，UE和UB的用法是一样的。不过，美中不足的就是UM迷你版没有demo文件，也没有部署说明，网上查了一下，也只有UE完整版、UB定制版的例子，没有UM的。

注意了，现在是重点。我先是按照UE完整版的部署说明去部署UM的，结果行不通，有些细微的差别的。好在，官网有UM的在线演示，我就在浏览器里查看那个在线演示的源码，学着去部署我的UM，结果好像行了，最后还有一个问题，就是上传图片不行。最后，我在结合UE的部署说明，综合了一下，终于弄出来了。

现在，附上核心部署代码：

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>UEditorMINI</title>
    <link href="themes/default/css/umeditor.min.css" type="text/css" rel="stylesheet">
    
    <script type="text/javascript" charset="utf-8" src="jquery-1.10.2.min.js"></script>
    <script type="text/javascript" charset="utf-8" src="umeditor.config.js"></script>
    <script type="text/javascript" charset="utf-8" src="umeditor.min.js"></script>
    <script type="text/javascript" charset="utf-8" src="lang/zh-cn/zh-cn.js"></script>
</head>
<body>
<script type="text/plain" id="editor" style="width:50%;height:500px;"></script>
<script type="text/javascript">
    var ue = UM.getEditor('editor');
</script>
</body>
</html>

下面，我们来看看UM的上传文件的设置：在这个文件里面设置的：/php/imageUp.php

//上传配置：上传的文件返回的URL就是这个，然后我们拿到这个URL进行各种操作，包括写入数据库
$config = array(
    "savePath" => "../upload/" ,             //存储文件夹
    "maxSize" => 1000 ,                   //允许的文件最大尺寸，单位KB
    "allowFiles" => array( ".gif" , ".png" , ".jpg" , ".jpeg" , ".bmp" ) //允许的文件格式
);
//上传文件目录：上传的文件就保存在这个目录里
$Path = "../upload/";