summernote 文本编辑器上传图片,视频媒体文件弹出对话框时整个页面都是灰色的无法使用

最新推荐文章于 2023-11-29 15:37:57 发布
最新推荐文章于 2023-11-29 15:37:57 发布
阅读量159 收藏
点赞数
文章标签： vue.js
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/a119600/article/details/132640040
版权

问题:在使用summernote 文本编辑器上传图片,视频媒体文件弹出对话框时整个页面都是灰色的无法使用

原因:是因为summernote 源码css样式有问题,

解决办法:

1.查看源码css样式

2.在需要使用summernote 插件,修改css样式,把这段代码写进去

木牛流码
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
summernote文本编辑器使用过程中遇到的坑
slowchen
11-29 6727
summernote文本编辑器使用时遇到的坑。 1. 获取纯文本 2. placeholder不显示
summernote 不能上传图片_图片上传功能设计的时候需要考虑些什么？
weixin_39622901的博客
12-06 408
嗨小伙伴们大家周末好～☀️今天小编给大家带来的文章是图片上传功能设计的时候需要考虑的因素，本篇文章是作者在完成项目的时候，在图片上传模块遇到了一系列的问题，有些问题开始时也没有想过，于是总结出来分享给大家，一起来看看吧！?(全文共计3209字，阅读约需要9分钟)文件上传首先上传文件分为很多种，比如说是文档doc？pdf？xlsx？，图片jpg？png？gif？psd？，视频mp4？avi...
summernote使用
Scotland Yard
05-25 230
博客地址博客原文
解决summernote富文本编辑器粘贴会出现两张图片
zelove1994的博客
10-17 220
解决summernote富文本编辑器粘贴会出现两张图片
若依上传文件不报错却也没有成功_从文件上传到命令注入
weixin_39652154的博客
12-06 1083
主站打开是这样的只有扫码登陆尝试扫码提示未注册查看js，网站用了webpack打包所有请求都在这个js里面尝试寻找敏感接口无果百度site:http://domain.com注意到wx1子域，打开这个链接跳转到在微信打开那就到微信打开，查看功能点发现一处上传，先上传正常图片改最下面的filename，后缀不变改上面的filename参数，发现应该是任意文件上传因为在js中发现php的ueditor...
summernote支持视频上传功能，综合几个版本亲测可用
chenqqabcdchenqqabcd的专栏
07-07 1910
原框架只支持视频链接上传，局限性比较大，不能上传本地的视频，综合这我查了几天资料 ，有个版本要么可用但是部分图标显示错误，综合0.8.12和0.8.18 版本整理。增加上传内容转载其他处，其余的均是自己代码或整理...
summernote文本编辑器demo有注释啥的傻瓜式
04-03
《Summernote文本编辑器：一个傻瓜式的富文本编辑器Demo详解》 在Web开发领域，用户界面的友好性和易用性是至关重要的。文本编辑器作为网页内容输入的重要工具，其性能和功能直接影响到用户的体验。Summernote是一...
summerNote富文本编辑器
03-29
轻量级文本编辑器，使用时需要先引入bootstrap文件，操作简单，相比较CKEditor轻便很多 取值：var info = $('#div_id').summernote('code'); 赋值：$('#div_id').summernote('code', "文本内容"); 加载文本编辑器：$...
基于BootStrap的文本编辑器组件Summernote
01-21
Summernote是一个基于jquery的bootstrap超级简单WYSIWYG在线编辑器。Summernote非常的轻量级，大小只有30KB，支持Safari,Chrome,Firefox、Opera、Internet Explorer 9 +(IE8支持即将到来)。 特点： 世界上最好的...
超漂亮的Bootstrap 富文本编辑器summernote
11-24
**超漂亮的Bootstrap富文本编辑器Summernote** Summernote是一款基于jQuery和Bootstrap构建的简单、灵活、所见即所得（WYSIWYG）的编辑器。它具有丰富的功能和高度可定制性，允许用户轻松地创建和编辑内容。不仅...
summernote-video-popover:支持视频标签上的弹出窗口
04-12
Summernote-Video-Popover 的插件。 添加一个用于调整大小和浮点属性的简单视频弹出框，其功能与图像弹出框完全相同。 支持从v0.8.0到v0.8.18的summernote。 安装 1.包含JS 在包括Summernote之后，包括以下代码。 < script src =" summernote-video-popover.js " > </ script > 2.包含CSS 由于视频控件会将点击事件阻止到Summernote编辑器中，尤其是在Firefox中，因为该事件涵盖了整个视频元素，因此使点击事件完全不可触发。 您可能需要使用以下样式表，以使单击事件直接传递给Summernote编辑器。 .note-editor .note-editing-area video{ pointer-events: none; } 这些样式表包含在summern
超好用的富文本编辑器，轻量级，不需要上传图片，视频，直接插入
06-29
超好用的富文本编辑器，轻量级，不需要上传图片，视频，直接插入，没有异步上传等垃圾步骤，直转base64码-summernote-0.8.8下载，富文本编辑器下载
summernote-audio:Summernote 插件通过 URL 或文件上传插入音频
05-29
Summernote-音频 插件通过 URL 或文件上传插入音频。 基于 Summernote 已经提供的 ImageDialog 和 VideoDialog。 安装 在包含 Summernote 之后包含插件脚本： <!-- include jquery, bootstrap, summernote here --> < link rel =" stylesheet " href =" summernote-audio.css " > < script type =" text/javascript " src =" summernote-audio.js " > </ script > 配置 将音频按钮添加到 Summernote 工具栏： $ ( '.summernote' ) . summernote ( { toolbar : [ [ 'inser
jQuery+Bootstarp富文本编辑器插件summernote
01-09
jQuery+Bootstarp富文本编辑器插件summernote
多功能文字编辑 图片上传 插入视频 详细例子可供参考 中文版
10-27
多功能文字编辑 图片上传 插入视频 详细例子可供参考 中文版。非常好用，轻量级
summernote支持自定义视频上传功能
夏已微凉、
07-23 865
用过的都知道，视频上传只能输入一个线上的视频地址，这肯定不行啊，咱得自定义上传。
fastadmin 引用Summernote富文本编辑器，上传本地视频
qq_40424757的博客
07-07 1318
文本编辑器，fastadmin,php, Summernote上传本地视频
summernote 插件插入本地视频文件
sinat_37497849的博客
11-29 496
summernote 上传本地视频
富文本编辑器summernote如何使用
最新发布
03-17
Summernote是一个基于JavaScript的富文本编辑器，它提供了一种简单而强大的方式来在网页上创建和编辑富文本内容。下面是使用Summernote的基本步骤： 1. 引入Summernote库：在HTML文件中引入Summernote的CSS和JavaScript文件。你可以从Summernote的官方网站上下载最新版本的文件，然后将它们添加到你的项目中。 2. 创建一个文本编辑区域：在HTML文件中创建一个textarea元素，用于显示和编辑富文本内容。给textarea元素添加一个唯一的id属性，以便在后续的JavaScript代码中使用。 3. 初始化Summernote：使用JavaScript代码初始化Summernote编辑器。通过选择器选择你之前创建的textarea元素，并调用summernote()方法来初始化它。例如，如果你的textarea元素的id为"myEditor"，那么初始化代码可以是： ```javascript $(document).ready(function() { $('#myEditor').summernote(); }); ``` 4. 自定义配置：你可以根据需要自定义Summernote的配置选项。例如，你可以设置编辑器的高度、语言、字体等。具体的配置选项可以参考Summernote的官方文档。 5. 获取和设置内容：你可以使用JavaScript代码来获取和设置Summernote编辑器中的内容。例如，使用.val()方法获取编辑器中的内容： ```javascript var content = $('#myEditor').summernote('code'); ``` 使用.html()方法设置编辑器中的内容： ```javascript $('#myEditor').summernote('code', '<p>这是新的内容</p>'); ``` 6. 其他功能：Summernote还提供了许多其他功能，如插入图片、链接、表格等。你可以在官方文档中找到更多关于这些功能的详细信息。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值