注册 登录  
 加关注
   显示下一条  |  关闭
温馨提示!由于新浪微博认证机制调整,您的新浪微博帐号绑定已过期,请重新绑定!立即重新绑定新浪微博》  |  关闭

天边云E家 shaoruisky

IT博文共享,知识的海洋

 
 
 

日志

 
 

CodeIgniter中集成百度在线编辑器UEditor  

2013-06-08 11:49:47|  分类: 网页设计 |  标签: |举报 |字号 订阅

  下载LOFTER 我的照片书  |

把UEditor下载下来,在CI的views层建立一个名为ueditor的文件夹,拷贝源码包中的dialogs、themes、third-party、editor_all.js和editor_config.js到ueditor文夹中。

然后在需要显示富文本编辑器的区域里加上下面代码:

 
1 <script type="text/javascript" src="<?=base_url().'application/views/default/'?>ueditor/editor_config.js"></script>
2 <script type="text/javascript" src="<?=base_url().'application/views/default/'?>ueditor/editor_all.js"></script>
3 <link rel="stylesheet" href="<?=base_url().'application/views/default/'?>ueditor/themes/default/ueditor.css"/>
4 <div id="myEditor"></div>
5 <script type="text/javascript">
6  //var URL= "<?=base_url().'application/views/default/'?>";
7     var editor = new baidu.editor.ui.Editor();
8     editor.render("myEditor");
9 </script>

刷新页面,可以看到编辑器就出来了。但是点击发现弹出层里的iframe页面没显示出来,用firebug等调试器一看,发现是相对路径出错了。

这个问题也好办,找到ueditor/ueditor_config.js文件,里面有配置路径的地方。看以下代码:

 
01 /**
02  *  ueditor完整配置项
03  *  可以在这里配置整个编辑器的特性
04  */
05   
06 (function () {
07     //这里你可以配置成ueditor目录在您网站中与根目录之间的相对路径或者绝对路径(指以http开头的绝对路径)
08     //window.UEDITOR_HOME_URL可以在外部配置,这里就不用配置了
09     //场景:如果你有多个页面使用同一目录下的editor,因为路径不同,所以在使用editor的页面上配置这个路径写在这个js外边
10     //var URL = window.UEDITOR_HOME_URL || '../';
11     var tmp = [removed].pathname,
12     //URL = window.UEDITOR_HOME_URL||tmp.substr(0,tmp.lastIndexOf("\/")+1).replace("_examples/","").replace("website/","");//这里你可以配置成ueditor目录在您网站的相对路径或者绝对路径(指以http开头的绝对路径)

把URL编程绝对路径。现在再刷新页面,OK了,Ueditor的弹出框也正常了。

  评论这张
 
阅读(108)| 评论(0)
推荐 转载

历史上的今天

在LOFTER的更多文章

评论

<#--最新日志,群博日志--> <#--推荐日志--> <#--引用记录--> <#--博主推荐--> <#--随机阅读--> <#--首页推荐--> <#--历史上的今天--> <#--被推荐日志--> <#--上一篇,下一篇--> <#-- 热度 --> <#-- 网易新闻广告 --> <#--右边模块结构--> <#--评论模块结构--> <#--引用模块结构--> <#--博主发起的投票-->
 
 
 
 
 
 
 
 
 
 
 
 
 
 

页脚

网易公司版权所有 ©1997-2016