68素材站

Layui 富文本编辑器的使用

68素材 6355 0

layui是一个基于js的前端框架,个人觉得比较好用,但是由于vue等的流行layui官网已经停止维护,下载可以在gitee下载,地址是:https://gitee.com/sentsin/layui

html代码:

<textarea class="layui-textarea" id="LAY_demo1" style="display: none;"></textarea>

js代码:

layui.use(['form', 'layedit'], function () {    
    var form=layui.form,layui.layedit;    
    var index1 = layedit.build('LAY_demo1', {            
        tool: ['strong', 'italic', 'underline', 'del', '|', 'left', 'center', 'right'],            
        height: 200        
    });
});

获得纯文本内容:

layedit.getText(index);

获取富文本内容:

layedit.getContent(index)

赋值编辑器内容:

layedit.setContent(index1, Content);
index1:创建富文本编辑器的索引
Content:赋值的内容

当然必须引用layui的js和css文件

至于图片等的上传需要在build之前设置如下配置:

layedit.set({
    uploadImage: {
        url: "{:url('home/index/uploader')}" //接口url
        , type: 'post' //默认post
    }
});

而接口返回的数据必须遵循如下格式:

[
    'code' => 0,
    'msg' => '上传成功',
    'data' => [
        'src' => '/storage/'.$saveName,
        'title' => $file->getOriginalName()
    ]
]


发表评论 (已有0条评论

还木有评论哦,快来抢沙发吧~