ThinkPHP整合百度Ueditor图文教程


Posted in PHP onOctober 21, 2014

ThinkPHP整合百度Ueditor,基于黄永成老师的视频说明的
申明:最好大家都能写绝对路径的都写好绝对路径比如:window.UEDITOR_HOME_URL

他在教程里面已经说了的,我就不再次说了啊,就一笔带过,好了不废话!

在调用编辑器的时候首先先初始化一些值:

<script type="text/javascript" charset="utf-8">
  window.UEDITOR_HOME_URL = "/Public/ueditor/"; //UEDITOR_HOME_URL、config、all这三个顺序不能改变
  window.onload=function(){
    window.UEDITOR_CONFIG.initialFrameHeight=300;//编辑器的高度
    window.UEDITOR_CONFIG.imageUrl="{:U('admin/Category/checkPic')}";     //图片上传提交地址
    window.UEDITOR_CONFIG.imagePath=' /Uploads/thumb/';//编辑器调用图片的地址
    UE.getEditor('contents');//里面的contents是我的textarea的id值
    
    }
 
</script>

然后再引入2个js文件,分别是:1、ueditor.all.min.js 2、ueditor.config.js
在这里申明一下 我以上说的调用方式,顺序绝对不能乱,乱了就会出问题了,所以你就按照我的按部就班的做吧!

因为我重写了编辑器的图片提交地址,所以我还得在控制器里面写一个对图片处理的方法。

代码如下:

//改变Ueditor 默认图片上传路径
    public function checkPic(){
      import('ORG.Net.UploadFile');
       $upload = new UploadFile();// 实例化上传类
       $upload->allowExts = array('jpg', 'gif', 'png', 'jpeg');// 设置附件上传类型
       $upload->autoSub =true ;
       $upload->subType ='date' ;
       $upload->dateFormat ='ym' ;
       $upload->savePath = './Uploads/thumb/';// 设置附件上传目录
       if($upload->upload()){
         $info = $upload->getUploadFileInfo();
         echo json_encode(array(
          'url'=>$info[0]['savename'],
          'title'=>htmlspecialchars($_POST['pictitle'], ENT_QUOTES),
          'original'=>$info[0]['name'],
          'state'=>'SUCCESS'
         ));
       }else{
         echo json_encode(array(
         'state'=>$upload->getErrorMsg()
         ));
           }
 
      }

我首先给大家看看代码先,在继续说明,

1、引入tp官方的文件上传处理类,然后初始化一些配置,这些都不介绍了啊!

2、判断他是否上传成功了,如果上传成功了,就先获取他的上传成功的信息,然后把数组转成json,用phpjson_encode。如果上传失败就把上传失败的信息直接返回!

以上都是在黄永成老师教程里面已经说明了的!就不详细说明了,不懂的就去看视频!

在整合好了上传后,发现上传的图片路径被转义了,一直显示不出来如图:

ThinkPHP整合百度Ueditor图文教程

我就在显示出数据的哪里用反转义函数,进行操作了一下{$article.content|stripslashes}这样就是把转义的字符串进行反转义,这样数据就能正常显示了
如图:ThinkPHP整合百度Ueditor图文教程

然后在前台模版显示数据的时候不仅要反转义还要去掉html实体化,{$article.content|htmlspecialchars_decode|stripslashes}这样就能正常显示了!

还有哟个问题,百度编辑器当里面的内容增长时,他的高度也是增长的,如图:

ThinkPHP整合百度Ueditor图文教程

解决方案就是在Ueditor的配置文件ueditor.config.js,里面的第428行打开注释,改成true,还有430行注释打开把他改成你初始化的的高度对应就好了。如图:

ThinkPHP整合百度Ueditor图文教程

这样编辑器就不会撑高了!如图:

ThinkPHP整合百度Ueditor图文教程

完结!!! 说的不好的大神勿喷~~这个只是分享交流,如果说错了 指出来就行了 谢谢~~~

补充说明:关于Ueditor在ie7下面调用不出来的bug问题解决办法,这个是前天逛官网的时候,发现一个人的这个问题的,因为我只有人见人爱的ie6,也都没有去测试,所以还是别人提醒,现在更正一下ie7的bug解决方案~感谢这位大湿啊~
如图:

ThinkPHP整合百度Ueditor图文教程

PHP 相关文章推荐
Php做的端口嗅探器--可以指定网站和端口
Oct 09 PHP
15种PHP Encoder的比较
Apr 17 PHP
火车采集器 免费版使出收费版本功能实现原理
Sep 17 PHP
zend framework配置操作数据库实例分析
Dec 06 PHP
免费的ip数据库淘宝IP地址库简介和PHP调用实例
Apr 08 PHP
php实现扫描二维码根据浏览器类型访问不同下载地址
Oct 15 PHP
PHP模拟登陆163邮箱发邮件及获取通讯录列表的方法
Mar 07 PHP
PHP简单获取随机数的常用方法小结
Jun 07 PHP
PHP7新特性之抽象语法树(AST)带来的变化详解
Jul 17 PHP
在PHP中实现使用Guzzle执行POST和GET请求
Oct 15 PHP
php+iframe 实现上传文件功能示例
Mar 04 PHP
THINKPHP-Apache服务器中使用Alias虚拟目录URL重写 隐藏index.php
Mar 09 PHP
浅谈PHP正则表达式中修饰符/i, /is, /s, /isU
Oct 21 #PHP
php读取目录及子目录下所有文件名的方法
Oct 20 #PHP
php中的字符编码转换函数用法示例
Oct 20 #PHP
PHP实现通过中文字符比率来判断垃圾评论的方法
Oct 20 #PHP
php的ZipArchive类用法实例
Oct 20 #PHP
php自定义apk安装包实例
Oct 20 #PHP
php防止站外远程提交表单的方法
Oct 20 #PHP
You might like
PHP CURL获取cookies模拟登录的方法
2013/11/04 PHP
PHP向浏览器输出内容的4个函数总结
2014/11/17 PHP
phplot生成图片类用法详解
2015/01/06 PHP
JavaScript中的对象化编程
2008/01/16 Javascript
JavaScript 对Cookie 操作的封装小结
2009/12/31 Javascript
js获取height和width的方法说明
2013/01/06 Javascript
Jquery在指定DIV加载HTML示例代码
2014/02/17 Javascript
JavaScript中setMonth()方法的使用详解
2015/06/11 Javascript
PHP自动加载autoload和命名空间的应用小结
2017/12/01 Javascript
代码详解Vuejs响应式原理
2017/12/20 Javascript
浅谈webpack打包之后的文件过大的解决方法
2018/03/07 Javascript
webpack源码之loader机制详解
2018/04/06 Javascript
vue单页缓存方案分析及实现
2018/09/25 Javascript
详解Vue.directive 自定义指令
2019/03/27 Javascript
Vue替代marquee标签超出宽度文字横向滚动效果
2019/12/09 Javascript
使用vue打包进行云服务器上传的问题
2020/03/02 Javascript
[02:45]DOTA2英雄基础教程 伐木机
2013/12/23 DOTA
[00:32]2018DOTA2亚洲邀请赛Newbee出场
2018/04/03 DOTA
python 实现tar文件压缩解压的实例详解
2017/08/20 Python
python 输出上个月的月末日期实例
2018/04/11 Python
提升Python程序性能的7个习惯
2019/04/14 Python
Python装饰器实现方法及应用场景详解
2020/03/26 Python
Pytorch框架实现mnist手写库识别(与tensorflow对比)
2020/07/20 Python
美国卡车、吉普车和SUV零件网站:4 Wheel Parts
2016/11/24 全球购物
英国安全产品购物网站:The Safe Shop
2017/03/20 全球购物
介绍一下linux的文件系统
2015/10/06 面试题
方正Java笔试题
2014/07/03 面试题
公司离职证明范本
2014/01/13 职场文书
一年级数学教学反思
2014/02/01 职场文书
银行竞聘演讲稿范文
2014/04/23 职场文书
学校社会实践活动总结
2014/07/03 职场文书
2014年社区综治工作总结
2014/11/17 职场文书
教师节获奖感言
2015/07/31 职场文书
值班管理制度范本
2015/08/06 职场文书
教你利用Nginx 服务搭建子域环境提升二维地图加载性能的步骤
2021/09/25 Servers
Python实现制作销售数据可视化看板详解
2021/11/27 Python