ThinkPHP5+layui 已解决---富文本编辑器图片保存后不显示的问题


今天调用了layui自带的富文本编辑器,里面有个图片上传按钮。按照官方文档调用设置,并书写图片上传接口,结果图片上传成功了,也回显了,但是提交表单保存的时候,只有文字部分,图片保存不上。后来找各种资料,发现应该这么写,代码如下:

HTML代码:

<div class="layui-form-item layui-form-text">
       <label class="layui-form-label">活动简介</label>
       <div class="layui-input-block">
            <textarea placeholder="请输入内容"  lay-verify="content" id="content" class="layui-textarea" style="height:300px" name="content">{$activity.content}</textarea>
       </div>
</div>

JS代码:

layui.use(['form', 'laydate', 'layer', 'upload','layedit'],
    function() {
        $ = layui.jquery;
        var form = layui.form,
            layer = layui.layer,
            laydate = layui.laydate,
            upload = layui.upload,
            layedit = layui.layedit;
        //内容富文本编辑
        layedit.set({
            uploadImage: {
                url: '{:url("uploadImgs")}' //接口url
                ,type: 'post' //默认post
            }
        });
        var index = layedit.build('content'); //建立编辑器
        form.verify({
            content: function(value) {
                return layedit.sync(index);
            }
        });
//监听提交
        form.on('submit(add)',
            function(data) {
                //发异步,把数据提交给php
                console.log(data.field);
                $.post("{:url('saveactivity')}",data.field,function(result){
                    // result = $.parseJSON(result);
                    if(result.code != '1'){
                        layer.alert(result.msg, {
                            icon: 5
                        });
                    }else{
                        layer.alert(result.msg, {
                                icon: 6
                            },
                            function() {
                                //关闭当前frame
                                xadmin.close();
                                parent.layui.table.reload('activitylist');
                            });
                    }
                });
                return false;
            });


最新回复 (0)
发新帖