summernote.js实际运用中遇到的上传图片大小控制及bootstrap模态框嵌套关闭这两个问题

这里先看一下summernote.js模样，如下图，可以添加图片、视频、链接等。

问题一：summernote.js在编辑框里具体是否有限制图片的大小，这个我也没有仔细研究，我只针对我的需求进行了修改。

需求：控制编辑框上传的图片不超过10M。

• 从summernote.js文件中找到如下图代码位置，选取需要上传的图片，获取图片的大小，将其当做新增参数（size），给img标签新增data-filesize属性。

• 在编辑框添加完图片之后，生成的HTML就如下图所示。

• 获取img标签的data-filesize属性，求编辑框中所有图片的大小，判断一下即可。

上面的操作是判断编辑框中添加的所有图片的大小不超过10M

下面如图，在选择图片的时候添加如下判断，只是对本次上传的单张或多张图片的大小进行判断

问题二：summernote.js与bootstrap模态框嵌套，关闭子模态框的同时，父模态框也关闭的问题

如下图所示，当点击子模态框的关闭按钮时，连同父模态框也一同关闭。

我的解决方法就是将在summernote.js中加载出来的模态框中，‘关闭’按钮的data-dimiss属性替换成js代码的click事件，用a.modal('hide')来隐藏模态框，如下图所示。