summernote 粘贴板图片上传到服务器

位置:首页>文章>详情   分类: 教程分享 > WEB基础   阅读(903)   2023-03-28 11:29:14
summernote 粘贴图片上传到服务器
以下为关键代码
//初始化富文本
            $('#description').summernote('destroy');
            $('#description').summernote({
                width:'100%',
                height:250,
                lang: 'zh-CN',
                focus: true,
                toolbar: [
                    ['style', ['bold', 'italic', 'underline', 'clear']],
                    ['fontsize', ['fontsize']],
                    ['color', ['color']],
                    ['para', ['ul', 'ol', 'paragraph']],
                    ['height', ['height']],
                    ['insert', ['picture']]
                ],
                callbacks: {
                    onImageUpload:function(files){
                        sendFile(files,'#description');
                    },
                    onPaste: function(event) {
                        console.log(event);
                        if ( event.clipboardData || event.originalEvent ) {

                            var bufferText = ((event.originalEvent || event).clipboardData || window.clipboardData).getData('Text/plain');
                            if(bufferText.length>0)
                            {
                                ;
                            }else
                                event.preventDefault();
                        }
                    }
                }
            });


 文件上传细节:
function sendFile(files, editor) {
            var formData = new FormData();
            formData.append('file',files[0]);
            $.ajax({
                url :  '/file/upload',//后台文件上传接口
            type : 'POST',
                data : formData,
                processData : false,
                contentType : false,
                success : function(res) {
                if(res.result==1)
                {
                    var path='/file/download'+"?fileId="+res.detail;//后台展示图片地址
                    $(editor).summernote('insertImage', path, function ($image) {
                        $image.css('width', 'auto');
                    });
                }else
                    layer.msg(res.message, {shift: 5});
            },error:function(){
                alert("上传失败");
            }
        });
        }
 
标签: summernote 编辑器
地址:https://www.leftso.com/article/630.html

相关阅读

summernote 粘贴图片上传到服务器以下为关键代码//初始化富文本 $('#description').summernote('destroy'); ...
在CKEditor4版本中,对于编辑器高度设置是通过config配置里面的属性height来实现的,如下方所示CKEditor5 版本查文档发现已经没有这个配置了,通过网络资料查询得知,CKEd...
在ckeditor4的时候绑定blur事件代码如下:window.editor.on('blur',function(){//这里写你想做的事儿})同样的代码搬到ckeditor5不仅不能用,还...