Summernote 是一个简单灵活的所见即所得的 HTML 在线编辑器，基于 jQuery 和 Bootstrap 构建，支持快捷键操作，提供大量可定制的选项。

但是却只有图片上传功能，没有视频上传功能，这里演示怎么增加一个视频上传功能  （批量上传写法在最下方）

基于v0.8.12版本

修改summernote.js文件 不要使用min.js文件（以下只是修改的说明，完整的js文件我也放到最后了）

1、 在 callbacks里增加一个 onFileUpload: null,

2、在video方法里面增加 attachment: 'Attachment', 后面的值就是页面上显示的名称 这里可以自己改

3、在VideoDialog.prototype.showVideoDialog方法里增加

var $videoAttachment = _this.$dialog.find('.note-video-attachment');
var callbacks = _this.options.callbacks;

　　　　　　　　　　$videoAttachment.off('change');
$videoAttachment.on('change', function (event) {
if (callbacks.onFileUpload) {
console.log(event.target.files);
_this.context.triggerEvent('file.upload', event.target.files);
}
});

_this.bindEnterKey($videoAttachment,$videoBtn);

如图所示，注意位置 不要加错

4、在VideoDialog.prototype.initialize方法里增加页面按钮代码

        '<div class="form-group note-form-group">',  
        "<label class=\\"note-form-label\\">" + this.lang.video.attachment + "</label>",  
        '<input class="note-video-attachment form-control note-form-control note-input" type="file" />',  
        '</div>',

添加好了之后，页面效果是这样的 会多一个附件上传按钮

接下来我们写页面的上传方法

$('.summernote').summernote({
placeholder: '请输入内容',
height : 192,
lang : 'zh-CN',
followingToolbar: false,
callbacks: {
onImageUpload: function (files) {
//图片上传
sendFile(files[0], this);
},
onFileUpload: function(files) {
//附件上传
sendVideoFile(files[0], this);
}

        }  
    });

    // 上传视频文件  
    function sendVideoFile(file, obj) {  
        var data = new FormData();  
        data.append("file", file);  
        $.ajax({  
            type: "POST",  
            url: ctx + "common/upload",  
            data: data,  
            cache: false,  
            contentType: false,  
            processData: false,  
            dataType: 'json',  
            success: function(result) {  
                if (result.code == web\_status.SUCCESS) {  
                    //上传之后的url赋值到 视频地址文本框  
                    $(".note-video-url").val(result.url);  
                    //去掉插入视频禁用按钮  
                    $(".note-video-btn").removeAttr("disabled");  
                } else {  
                    $.modal.alertError(result.msg);  
                }  
            },  
            error: function(error) {  
                $.modal.alertWarning("视频上传失败。");  
            }  
        });  
    }

    // 上传图片文件  
    function sendFile(file, obj) {  
        var data = new FormData();  
        data.append("file", file);  
        $.ajax({  
            type: "POST",  
            url: ctx + "common/upload",  
            data: data,  
            cache: false,  
            contentType: false,  
            processData: false,  
            dataType: 'json',  
            success: function(result) {  
                if (result.code == web\_status.SUCCESS) {  
                    $(obj).summernote('editor.insertImage', result.url, result.fileName);  
                } else {  
                    $.modal.alertError(result.msg);  
                }  
            },  
            error: function(error) {  
                $.modal.alertWarning("图片上传失败。");  
            }  
        });  
    }

视频后台的上传方法这里就不展示了，这个网上有很多，可以自行百度

最终的呈现效果是这样

修改后的 summernote文件包

下载地址：https://yvioo.lanzous.com/ixLnokm2xjg

以上的只能上传一张，如果要实现批量上传，只需要稍微改下即可，其他不变

在上传方法外面加一个for循环即可