thinkPHP和百度ueditor对接经验分享

thinkPHP和百度ueditor对接经验分享
下载百度ueditor文件解压到Public文件下
在需要的界面上引入以下js<script></script><br>     <script></script><br>     <script></script>在html代码上这样来写<!-- 加载编辑器的容器 --><br><script></script>在html页面上js这样来写（根据自己的需要选择自己所要的富文本功能）    <script><br /> $(document).ready(function(){<br /> <br /> var ue = UE.getEditor(&#039;container&#039;,{<br /> toolbars:[[<br /> &#039;undo&#039;, &#039;redo&#039;, &#039;|&#039;,<br /> &#039;bold&#039;, &#039;italic&#039;, &#039;underline&#039;, &#039;fontborder&#039;, &#039;strikethrough&#039;, &#039;removeformat&#039;, &#039;formatmatch&#039;, &#039;autotypeset&#039;, &#039;blockquote&#039;, &#039;pasteplain&#039;, &#039;|&#039;, &#039;forecolor&#039;, &#039;backcolor&#039;, &#039;insertorderedlist&#039;, &#039;insertunorderedlist&#039;, &#039;selectall&#039;, &#039;cleardoc&#039;, &#039;|&#039;,<br /> &#039;rowspacingtop&#039;, &#039;rowspacingbottom&#039;, &#039;lineheight&#039;, &#039;|&#039;,<br /> &#039;customstyle&#039;, &#039;paragraph&#039;, &#039;fontfamily&#039;, &#039;fontsize&#039;, &#039;|&#039;,<br /> &#039;directionalityltr&#039;, &#039;directionalityrtl&#039;, &#039;indent&#039;, &#039;|&#039;,<br /> &#039;justifyleft&#039;, &#039;justifycenter&#039;, &#039;justifyright&#039;, &#039;justifyjustify&#039;, &#039;|&#039;,<br /> &#039;link&#039;, &#039;unlink&#039;, &#039;|&#039;, &#039;imagenone&#039;, &#039;imageleft&#039;, &#039;imageright&#039;, &#039;imagecenter&#039;, &#039;|&#039;,<br /> &#039;simpleupload&#039;, &#039;insertimage&#039;, &#039;emotion&#039;, &#039;attachment&#039;, &#039;map&#039;,&#039;pagebreak&#039;, &#039;|&#039;,<br /> &#039;horizontal&#039;, &#039;date&#039;, &#039;time&#039;, &#039;spechars&#039;, &#039;|&#039;,<br /> &#039;inserttable&#039;, &#039;deletetable&#039;, &#039;insertparagraphbeforetable&#039;, &#039;insertrow&#039;, &#039;deleterow&#039;, &#039;insertcol&#039;, &#039;deletecol&#039;, &#039;mergecells&#039;, &#039;mergeright&#039;, &#039;mergedown&#039;, &#039;splittocells&#039;, &#039;splittorows&#039;, &#039;splittocols&#039;, &#039;|&#039;,<br /> &#039;print&#039;, &#039;searchreplace&#039;, &#039;drafts&#039;<br /> ]],<br /> initialFrameHeight:250<br /> });<br /> <br /> });<br /> <br /> <br /> </script>此处我是使用了上传图片的功能（其他功能处理方式一样），但需要对路径配置好
在ueditor文件夹里/php/路径下有config.json文件，修改里面的imagePathFormat和imageMaxSize属性,此处是配置上传的地址。/* 上传图片配置项 */<br>     "imageActionName": "uploadimage", /* 执行上传图片的action名称 */<br>     "imageFieldName": "upfile", /* 提交的图片表单名称 */<br>     "imageMaxSize": 20480000, /* 上传大小限制，单位B */<br>     "imageAllowFiles": [".png", ".jpg", ".jpeg", ".gif", ".bmp"], /* 上传图片格式显示 */<br>     "imageCompressEnable": true, /* 是否压缩图片,默认是true */<br>     "imageCompressBorder": 1600, /* 图片压缩最长边限制 */<br>     "imageInsertAlign": "none", /* 插入的图片浮动方式 */<br>     "imageUrlPrefix": "", /* 图片访问路径前缀 */<br>     "imagePathFormat": "/File/Public/Uploads/ueditorimage/{yyyy}{mm}{dd}/{time}{rand:6}",/* 列出指定目录下的图片 */<br>     "imageManagerActionName": "listimage", /* 执行图片管理的action名称 */<br>     "imageManagerListPath": "/File/Public/Uploads/ueditorimage/", /* 指定要列出图片的目录 */<br>     "imageManagerListSize": 20, /* 每次列出文件数量 */<br>     "imageManagerUrlPrefix": "", /* 图片访问路径前缀 */<br>     "imageManagerInsertAlign": "none", /* 插入的图片浮动方式 */<br>     "imageManagerAllowFiles": [".png", ".jpg", ".jpeg", ".gif", ".bmp"], /* 列出的文件类型 */如果对上传图片的地方有一个图片列表不需要，可以到相应的模板上去注销相应的代码即可，我注销的是dialogs/image/images/image.html下的 <!--<span class="tab" data-content-id="online"><var id="lang_tab_online"></var></span><br /> <span class="tab" data-content-id="search"><var id="lang_tab_search"></var></span>-->附件是我使用ueditor的版本，建议使用最新或最稳定的版本。

ueditor_release-ueditor1_4_3_1-utf8-php.zip ( 2.78 MB 下载：45 次 )

AD：真正免费，域名+虚机+企业邮箱=0元