UEditor编辑器的简单引入部署如下:

<html>

<head>
    <meta charset="UTF-8">
    <title>ueditor demo</title>
</head>

<body>
        <!-- 加载编辑器的容器
编辑器容器主要是通过ID来取得“联系”
    <script id="container" name="content" type="text/plain">
        这里写你的初始化内容
    </script>

         -->
   <table width="90%" id="detail-table" style="display:none">
    <tr>
    <!-- 加载编辑器的容器-->
    <td><textarea name="goods_desc" id="goods_desc"></textarea></td>
    </tr>
    </table>
    <!-- 引入配置文件,注意引入路径 -->
    <script type="text/javascript" charset="utf-8" src="../lib/ueditor/ueditor.config.js"></script>
    <!-- 引入编辑器源码文件 -->
    <script type="text/javascript" charset="utf-8" src="../lib/ueditor/ueditor.all.min.js"></script>
    <!-- 实例化编辑器 -->
    <script type="text/javascript">
     var ue = UE.getEditor('goods_desc',{initialFrameHeight:620,initialContent:'这里是内容!'});//传了两个自定义参数
    </script>
</body>
</html>

  UEditor编辑器自定义参数的传入:

编辑器有很多可自定义的参数项,在实例化的时候可以传入给编辑器:

var ue = UE.getEditor('container实例化ID', {
    autoHeight: false});

配置项也可以通过 ueditor.config.js 文件修改,具体的配置方法请看前端配置项说明

UEditor编辑器设置和读取编辑器的内容:

通 getContent 和 setContent 方法可以设置和读取编辑器的内容

var ue = UE.getContent();//对编辑器的操作最好在编辑器ready之后再做ue.ready(function() {
    //设置编辑器的内容
    ue.setContent('hello');
    //获取html内容,返回: hello
    var html = ue.getContent();
    //获取纯文本内容,返回: hello
    var txt = ue.getContentTxt();});

UEditor 的更多API请看API 文档

UEditor编辑器修改上传文件存放路径:

找到上传配置文件config.json(路径ueditor/php/config.json),修改成相应的路径即可。

如:/* 上传图片配置项 */
"imagePathFormat": "/bool/data/upload/image/{yyyy}{mm}{dd}/{time}{rand:6}",//路径已改


Bài viết này đến từ http://www.chieng.cn, được sao chép, vui lòng ghi rõ!

打赏 支付宝 微信