contentEditable=‘true‘后video不能删除

最新推荐文章于 2024-06-03 15:13:51 发布
最新推荐文章于 2024-06-03 15:13:51 发布
阅读量796 收藏
点赞数
分类专栏： H5+C3 Git ES6 文章标签： javascript html5 html
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_43825473/article/details/122371296
版权
H5+C3 同时被 3 个专栏收录
10 篇文章 0 订阅
订阅专栏
Git
3 篇文章 0 订阅
订阅专栏
ES6
2 篇文章 0 订阅
订阅专栏
当在HTML页面中使用contentEditable属性时，发现无法删除video元素。为解决这个问题，只需在video标签后面添加一个<br>标签，即可正常编辑并删除video。此方法对于维护富文本编辑器的兼容性具有重要意义。
摘要由CSDN通过智能技术生成

contentEditable='true'后video不能删除


在video标签后面加一个 <br>标签即可

耿彬
关注
专栏目录
Love表白神器
LilyCoder的博客
11-28 388
h3{ font-size: 60%; } body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,.
【Python】高效的Web自动化测试利器—Python+Playwright快速上手自动化实战指南
最新发布
墩墩分墩
08-16 2196
**Playwright是微软在` 2020 年初 `开源自动化测试工具，功能和 selenium 类似，都可以驱动浏览器进行各种自动化操作。** - 支持主流浏览器，如Chrome、Firefox、Safari 等，同时支持以**无头模式、有头模式**运行，并提供了**同步、异步的 API**，可以结合 `主流测试框架`使用，并且支持浏览器端的自动化脚本录制等功能。 **特点：** - 跨浏览器：Playwright 支持所有现代渲染引擎，包括Chromium、WebKit 和 Firefox； - 跨
百度富文本编辑器UMEditor 添加视频无法删除 解决方法
qq_29096549的博客
07-13 3029
var child = range.startContainer; if (child != null) { if (child.tagName == "VIDEO") { domUtils.remove(child); } } 给编辑器的 ueditor.all.js 里的 "keydown"监听事件里加上方代码即可.
div contenteditable disabled 失效问题
qq_36958916的博客
10-09 780
div contenteditable disabled 失效问题
div设置参数contenteditable=true
weixin_30892889的博客
10-18 165
div设置参数contenteditable=true后就可以实现和文本框一样的效果，可以输入文字 <div id="id" contenteditable="true"></div> 转载于:https://www.cnblogs.com/zhja/archive/2012/10/18/2729485.html...
div添加contentEditable=true的坑
Jennie的专栏
10-13 1456
div添加contentEditable=true;回退键backspace无法删除光标左侧的文字，但是，delete键可以删除光标右侧的文字。 查了资料（资料的链接：https://www.cnblogs.com/CherishTheYouth/p/CherishTheYouth_1105.html），启发我了。给这个元素添加keydown的事件监听，阻止冒泡就解决了问题。
【Vue】div标签实现输入框，利用contenteditable=“true“属性的标签实现
强者惜字如金，弱者废话连篇！
07-26 3909
【代码】div标签实现输入框，利用contenteditable=“true“属性的标签实现评论。
牛客网选择题
PPDY93的博客
04-07 1587
文章目录Java选择题数量关系选择题 Java选择题 应用程序的main方法中有以下语句，则输出的结果( ) String s1=new String（ ” xyz ” ）; String s2=new String（ ” xyz ” ）; Boolean b1=s1.equals(s2); Boolean b2=(s1 = =s2); System .out.print(b1+ ” ” +b2); 正确答案: A 你的答案: A (正确) A. true false B. false true C
上传文件、视频、图片、全选、全不选、截屏直接粘贴图片
懒虫的博客
08-20 356
上传文件、视频、图片、全选、全不选、截屏直接粘贴图片 控制器代码：ObUnitsController.php <?php namespace App\Admin\Controllers; use App\Admin\Actions\Units\UnitsImportAction; use App\Models\AdminUsers; use App\Models\PubCountry; use App\Models\ObUnits; use App\Models\PubUnitsList; us
「前端+鸿蒙」核心技术HTML5+CSS3（十）
AIGC大前端小王子
06-03 1087
H5是HTML5的简称，是构建现代网站和网络应用的标准标记语言。HTML5新增了许多功能，包括更好的多媒体支持、新的表单控件、绘图功能以及对响应式设计的改进。
dom属性 contenteditable=”true” 容器里的一些表现特性心得
weixin_34072159的博客
05-05 239
发现blog都快长毛了~ ，最近几个月文章产出少，都在折腾杂碎。 不过还是有点心得 想记录下来。 比如：编辑器模式 contenteditable=”true” 因为组件主要，接触了个把月的 编辑器模式，接触到了很多跟编辑器模式 相关的特性。 稍微整理一下甩出来 晒晒，说错了别抽我，一知半解，还有一堆问题。 ^__^ 1.如何支持成块编辑 inline-block 有一种场景，如添加某 标签词...
可编辑div：contenteditable=true
sslyfnk的博客
12-02 1303
可编辑div：contenteditable=true（让div+css可以相当于Input） 可以使用这个属性自定义富文本编辑器，可以自己设置样式功能等。 这是使用contenteditable=true来制作的一个类似Notion的笔记编辑器 /** 这里以vue举例，这是一个富文本编辑的笔记工具 */ <template> <div class="edit" :type="type" contenteditable="true" :placehol
H5系列之contenteditable
weixin_30519071的博客
08-12 197
其实这个属性很简单，既然把它放到一个单独的文章来说，他肯定有一些注意点要讲 兼容性很好，兼容所有主流浏览器。 用法很简单，只需要给你需要的标签填上即可。 <div contenteditable="true">我是一个div</div> 那么会出现一个神奇的效果。(文字可以编辑) 语法也很简单。 contenteditable=...
JS解决contenteditable=“true“的光标位置放到最后
刻痕
08-31 1833
JS解决contenteditable="true"的光标位置放到最后 元素设置可编辑后，光标输入时候位置有问题处理。网搜了下能用，记录下。劝大家还是尽量用input这种标签编辑体验好一些，也省了一些问题 ```javascript function keepLastIndex(obj) { if (window.getSelection) {//ie11 10 9 ff safari obj.focus(); //解决ff不获取焦点无法定位问题 var range
给元素设置contenteditable=“true“后,阻止输入回车键
qq_42372534的博客
03-22 1953
设置该元素 display:flex
ueditor删除视频
六一首席
02-27 807
1：打开ueditor.all.js 2：CTRL+F 搜索 //注册del/backspace事件 3：添加如下内容 原来的代码 var caption = domUtils.findParentByTagName(me.selection.getStart(), 'caption', true), range = me.selection.getRange(); if (range...
vue 中修改contenteditable=“true” 属性 ， vue中给dom 元素 添加 contenteditable属性(1)
java_dazhuzhu的博客
05-16 626
如果你打算靠自己摸索自学，那么你首先要了解学习前端的基本大纲，这是你将要学习的主要内容，理解以及掌握好这些内容，便可以找到一份初级的前端开发工作。你还需要有一套完整的前端学习教程，作为初学者最好的方式就是看视频教程学习，初学者容易理解接受。不要选择买书学习，这样的方式没有几个人能学会，基本都是看不下去书，也看不懂书。如果喜欢看书的学弟，可以买一些经典的书籍作为辅助即可，主要还是以看教程为主。每天抽出固定几个小时学习，做好长期学习的准备。
div的contenteditable=true;属性使其可编辑
hangGe0111的博客
07-30 1933
1.true可编辑 2.false不可编辑   http://www.w3school.com.cn/tags/att_global_contenteditable.asp 3.plaintext-only只能输入纯文本 4.更多参考   https://w3c.github.io/editing/contentEditable.html#contenteditable 5.代码和展示...
firefox的标签打开contenteditable属性时能够跨区删除
我的笔记
04-11 1718
测试发现:firefox下面,假设有一标签a1在排版位置的前面,a2在排版位置的相对a1的后面,a1/a2同时打开可编辑属性contenteditable时,在a2中进行删除时,一直按住删除键不放,就会也同时把a1编辑区的内容删除掉,在ie中却不会出现这种问题;看来在firefox中,删除对于可编辑区来说,会有tab的功能作用且发现在这种状态在,反选的字是使用删除键是无反应的;分组名列中d/测试二
contenteditable=true
06-28
### 回答1： contenteditable=true是一种HTML属性，允许用户在网页上编辑和修改文本内容。这个属性可以应用于任何HTML元素，包括段落、标题、表格、列表等等。通过设置contenteditable=true，用户可以直接在网页上进行编辑，而不需要使用外部编辑器或者其他工具。这个属性在一些网站上被广泛使用，例如博客、社交网络、在线文档等等。 ### 回答2： contenteditable=true是一种HTML属性，用于设置网页中的元素是否可编辑。如果将该属性设置为true，用户可以在浏览器中直接编辑网页中的文本、图像和其他元素。 使用contenteditable=true可以方便用户直接在网页上进行修改、编辑，而不需要再使用外部编辑器。这种方式通常用于Web应用程序中，用户可以自由编辑自己的信息，并实时保存修改结果。此外，contenteditable=true还可以用于创建在线富文本编辑器，以提供更完整的编辑功能。 但是，使用contenteditable=true也存在一些问题。首先，内容可编辑后会增加需要处理的交互和验证逻辑，因此需要反复测试和优化。其次，由于contenteditable=true直接允许用户在网页上进行修改操作，因此可能会出现不合法的修改，如删除关键信息、非法内容等等。为此，需要对用户输入进行限制和监测，以预防此类问题的出现。 总的来说，contenteditable=true是一种方便的HTML属性，可以为用户提供更好的编辑体验和操作便利性。但同时也需要进行完善的验证和限制，以保障网页的安全性和正确性。 ### 回答3： contenteditable=true是一种HTML特性，允许将网页上的任何元素（比如文本、图片、表格等）设为可编辑状态。它使得用户可以直接在网页上编辑内容，像在Word文档中一样方便。 使用contenteditable=true的好处是可以极大地提高用户的编辑效率，比如在撰写长篇文章或者编辑表格时。用户不需要再复制粘贴内容到其他软件中进行编辑，而是可以直接在网页上进行操作。此外，使用contenteditable=true可以让用户更好地掌控网页内容的布局和格式，很大程度上可以提升用户体验。 尽管contenteditable=true提供了方便的编辑功能，但是它也存在一些问题。首先，由于它允许用户随意编辑网页内容，这可能导致网页的格式混乱不堪、样式失调甚至内容错误。其次，使用contenteditable=true可能会使得网页的安全性降低，因为用户可以随意修改网页内容，这可能导致一些潜在的安全隐患。 因此，在使用contenteditable=true时，需要注意一些事项。比如，要对输入内容进行验证和过滤，以防止恶意的、不符合规范的输入。此外，还需要在发现有人在不合理地修改网页内容时，做出适当的处理，比如禁止该用户进一步的编辑等。 总之，contenteditable=true是一个方便快捷的特性，可以提升用户的编辑效率，但是需要注意潜在的安全问题。在使用时，需要合理斟酌。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值