百度UEditor编辑器使用（二）

本文摘自：http://www.cnblogs.com/pmpen/archive/2011/09/19/2181811.html

首先感谢分享

百度WEB前端设计部推出一款开源的编辑器UEditor   http://ueditor.baidu.com/index.html ，这款编辑器相当强大，它提供了百度地图，google地图和视频等一些非常强大的功能 ，毕竟是国内大企业肯定是要关注的。

　　在ueditor1.1.5版本的使用很简单

　　1、包含头文件

　　　　<link href="../themes/default/ueditor.css" rel="stylesheet" type="text/css" /> 

　　　　<script src="../editor_config.js" type="text/javascript"></script> 

　　　　<script src="../editor_ui_all.js" type="text/javascript"></script>

　　　　将入口的js文件和css文件包含进来

　　2、html代码

　　　　<form action="add.php"  method="POST" >

　　　　<textarea id="editor"  ></textarea> <!--内容输入框 注意id的命名-->

<script language="javascript" type="text/javascript">  <!-- UEditor --> 

　　var editor = new baidu.editor.ui.Editor(); <!--new一个对象，通过对象创建编辑器-->

　　editor.render("editor");<!--出入参数editor为textarea中的id值，并生成编辑器-->

</script>

<input type="submit" name="sub"/>

      </form>

　　3、服务器接收数据

　　　　我的form表单中提交到add.php文件中，在add.php中通过$_POST接收编辑器传入的数据（asp、jsp也是一样的，只是提交到服务器的文件不一样）。

　　　　UEditor对编辑器编辑的内容有一个默认的名editorValue，所以可以通过$_POST['editorValue']接受出过来的数据。

　　以上就完成了对UEditor的配置

　　　　4、其他问题

　　　　　　1、如果你需要设置UEditor的一些参数的话，只要在HTML代码中的js片段断码加以修改

　　　　　　<script language="javascript" type="text/javascript"> 

var option = {

   initialContent: '在编辑器中默认显示的内容',　　//初始化编辑器的内容

   minFrameHeight: 200, 　　　　　　　　　//设置高度

   textarea: 'content'    　　　　　　　　　　 //设置提交时编辑器内容的名字，之前我们用的名字是默认的editorValue

};

   var editor = new baidu.editor.ui.Editor(option);　　　//将设置初始化（之前的配置采用的是默认的，所以没有传参数）

editor.render("editor");

</script>

　　　　　　2、如果你的UEditor都弄好了，但是发现百度地图、google地图、视屏、表情都无法正常显示，问题可能是你的UEditor文件没有放在你的跟目录下，

　　　　　　　　但调用的文件是在根目录下（只要你调用UEditor的文件和UEditor文件没有放在同一级文件夹下面）。这是因为UEditor是根据相对路径来确定

　　　　　　　　调用自身的其他文件的，如果改成绝对路劲就可以解决这个问题了。

　　　　　　　　解决：

　　　　　　　　在UEditor（不一定是这个名称，看你命名是哪个就是哪个）文件夹下，有个配置文件editor_config.js，在里面可以更改配置信息。

　　　　　　　　更改"UEDITOR_HOME_URL"这个值，改为UEditor这个文件夹得在服务器下的绝对路径

　　　　　　　　例如：

　　　　　　　　UEDITOR_HOME_URL:'http://localhost/QingBlog/pm-static/UEditor/', //这里你可以配置成ueditor目录在您网站的绝对路径

　　　　　　　　OK  啦！