您的位置：首页 > 产品设计 > UI/UE

搞定百度编辑器UEditor

2015-08-20 12:07 344 查看

已经有很长时间没更了，翻了下最近一次的博客，竟然是两年半以前，不禁愕然。那还是我刚毕业那会在第一家公司写的。

弹指间，三年倏忽而过。从初入社会不经世事的菜鸟到如今和几个同事合伙创业的男屌，在职场中浸淫，在代码中求索，横冲直撞少了，但出口伤人还是不自觉，言不由衷多了，但曲意逢迎讨好别人还是学不来。

不矫情了，说说编辑器。

一直都觉得我们公司用的富文本编辑器太丑又太low，空的时候想搞个新的编辑器。

网上搜了下，百度编辑器，一眼就喜欢上了，看样子就吊炸天，还是百度出的，一定各种靠谱。

立马下下来，开搞。结果遇到了很多问题。配置烦的一逼，最蛋疼的是图片上传不了。看了很多帖子，下的版本不一样，解决办法不同，眼都快瞎了。好不容易搞定所有问题，上传服务器，结果图片又不能传了。坑爹的百度编辑器，真是日了狗了。

由于在这玩意上面花了太多时间，又不太喜欢KindEditor和CKEditor，估计也是先入为主的原因，搞定百度编辑器后，觉得应该有很多人遇到和我相同的问题，于是决定把解决百度编辑器的过程分享出来，希望对想用UEditor的苦逼程序猿们有所帮助。

一、下载编辑器
http://ueditor.baidu.com/website/download.html

看准我下的版本，如果想下别的版本，下面的内容就别看了

二、下载好后，建个项目，把下载的UEditor放到根目录，然后在根目录建一个新页面index.aspx

index.aspx的代码如下，只是个例子：

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script src="ueditor/ueditor.config.js" type="text/javascript"></script>
<script src="ueditor/ueditor.all.min.js" type="text/javascript"></script>
<script src="ueditor/lang/zh-cn/zh-cn.js" type="text/javascript"></script>
</head>
<body>
<div>
<script id="editor" type="text/plain" style="width:900px;height:500px;"></script>
</div>

<script type="text/javascript">
//实例化编辑器
//建议使用工厂方法getEditor创建和引用编辑器实例，如果在某个闭包下引用该编辑器，直接调用UE.getEditor('editor')就能拿到相关的实例
var ue = UE.getEditor('editor', { autoHeight: false,maximumWords:10000 });

</script>
</body>
</html>

然后。。。。就OK啦

，根本就不需要配置什么！本地浏览下，是不是可以上传图片了

。现在知道我为嘛只下上面的那个版本了吧，血淋漓的教训哇。
三、发布

把项目源码发布到服务器上，百度编辑器是可以上传图片的。但是编译后上传服务器，结果就不能上传图片了，百度编辑器上传图片的按钮会变灰。

如果你平时都源码发布程序，那么到此为止，百度编辑器就搞定了。如果你的项目要编译后发布，别急，解决办法如下：

1、把代码编译后传到服务器。

2、打开http://fex.baidu.com/ueditor/#server-net ，照着上面去配置服务器。

3、你会发现走到配置说明的第1.3步的时候会报错。这时候，再从官网上下一份刚才版本的编辑器，解压后找到net文件夹。然后把这个net文件夹覆盖你刚才编译后上传的net文件夹

4、再试试部署说明的1.3步，是不是不报错啦。然后浏览器打开index.aspx。是不是也能上传图片啦。

大功告成，收工。

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航