Maison >php教程 >php手册 >UEditor编辑器并不难,ueditor并不难

UEditor编辑器并不难,ueditor并不难

WBOY
WBOYoriginal
2016-06-13 08:53:111070parcourir

UEditor编辑器并不难,ueditor并不难

1.背景:

       其实学习UEditor本该在这之前就应该学习整合到自己的项目中的了,第一次接触UEditor是在暑假期间,当时做东西在师兄的代码中发现了这东西,心想:卧槽,竟然可以这样整合别人的东西!      学习接口性质类的东西,最官方权威的时候是看官方文档,但是我想还是有人因该跟我一样,对这东西天生还是有点恐惧感的!多少需要别人来告诉自己一声:其实这个很简单,这么去学就很简单了!因此,有缘人啊....如果看到这篇文章并且坚持看到了这里,那你不妨继续看下去,在这篇博客中,记录了:编辑器的原理各种常用编辑器的引入的一个大概的思路与学习方法!【当然,如果写错了,还请留下您宝贵的指点意见,谢谢指教,欢迎指教学习】(由于从为知笔记同步到博客的,代码编排真是丑哭了朕,所以我附上的是代码截图)       百度针对论坛贴吧评论,又做了一个UM的编辑器,是UE的简化版!大家也可以去看看~ 对于此次学习,有以下几点编程感悟: ==>1).技术都是想的难,其实很简单==>难是难在自己的想法了,认为很难!要尝试静下心去看这个东西! ==>2).对于编辑器,在线支付,微信开发接口....这些不是PHP知识点的知识[因为这些东西都是单纯的调用API罢了],最好的方法==>读官方手册,最权威;看下载压缩包中的example实例,入门最快; ==>3).多动手,跟着官方文档的思路去敲代码!你不可能会所有语言,因此对待不懂的语言不要去抗拒!语言是学不完的【不管你懂不懂引入的这个语言,先把东西做出来再说】

2.编辑器原理:

    1).什么是编辑器==>对文字有编辑作用[修改,删除....],对文字的加粗,划下划线......这些都是对文字样式的改变(其实并不属于编辑器的功能,但是现在大多编辑器都集成了)           ==>下面这段代码,对于“hello world!”这几个字只是单纯的一个显示,我们无法删除,无法重新修改           ==>但是对于下面这个div呢?你还是单单只能看这个内容:“hello lms, what you like ?......”吗?     2).编辑器原理:           ==>插入一个iframe,并利用网页的contentEditable属性,使得该iframe可以编辑;           ==>利用JS改变文字的样式,完成加粗,变色,加下划线,上传图片效果           ==>最后获取该区域的内容即可!至于如何处理,这些都是业务逻辑代码了!

3.常见的编辑器:

1).比较长久老牌:FCKEditor-->更名为CKEditor;KindEditor【比较老,教程这些的都很多....】
2).国内淘宝用的:ewebEditor
3).目前比较新,流行的:UEditor,UM编辑器[为论坛贴吧定制的]==>都是百度出的!

4.如何学习编辑器:最权威,最官方的就是取看官方文档【以UEditor为例】

          1).如何引入                      ==>就是引入几个js文件的事                      ==>http://fex.baidu.com/ueditor/官方DOC文件《1.2 创建demo文件》中有详细说明

          2).如何个性化配置==>                 (1).在引入页面覆盖配置【推荐使用这个】                      ==>去配置文件中找到对应的配置项,拼接成一个对象,当成参数传给UE.getEditor('container',{配置项1 , 配置项2, ...... })进行设置                 (2).对配置文件进行修改==>【一修改,那么所有引用了这个编辑器的都会被更改】                      ==>ueditor.config.js【前台显示配置】           3).如何与自己系统整合==>                 (1).现在你所需要运用编辑器的地方,将编辑器的"前端"引入进来;==>路径URL写死[整合到项目中的时候,资源是不能乱放的]                 (2).==>对应语言的包下的config.json【后台处理配置--图片、视频上传路径....将默认的目录路径改为你要存放的地方】                             .在表单中要加上: enctype="multipart/form-data"==>有文件上传,图片上传等必须要加[以二进制数据进行传输数据]                             .对于不明确的路径,使用firebug查看原本路径,一直追溯路径变量                             ③.使用firebug查看返回来的值,查看返回来的[以上两个是针对于出现问题时候,调试可以用的方法]                             ④.UE的1.4.2+版本中的通用上传类Upload.class.php,所有配置都写在了config.json中,只需要在config.json中修改对于路径即可                            ⑤.1.4.2+ 以后路径配置主要相关的配置项是 PathFormat【上传保存路径】 和 UrlPrefix【访问路径--对于ASP和.net来说需要配置】的配置项                        ⑥.1.4.2+ 路径配置项无论是否以 "/" 开头,都是相对于 网站根目录 的路径。                              ⑦.后台会过滤模板上的非法字符==> \ : * ? " |   ==>这些非法字符都会被替换成空   来自为知笔记(Wiz)



Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn