富文本编辑器中<br/>啥操作

Posted 2023-05-01

富文本编辑器中<br/>什么操作，富文本编辑器，Rich Text Editor, 简称 RTE, 是一种可内嵌于浏览器，所见即所得的文本编辑器。它是一种解决可一般的用户不同html等网页标记但是需要在网页上设置字体的颜色、大小、样式等信息问题一个文本编辑器。下面简单的介绍一下富文本编辑器的用法和简要的原理。
1、什么是富文本编辑器？富文本编辑器不同于我们平时的文本编辑器，但是其功能确实和我们的平时使用的word的是类似的，只不过富文本编辑器设置是解决不会编写 HTML 的用户并需要设置各种文本格式在我们的网页上。
2、富文本编辑器的原理和应用富文本编辑器的应用，比如做为一个网站的开发者，当我们需要一个发布文章的功能时候，用户可能不知道html代码，此时我们可以使用一些别人写好的富文本编辑器嵌入到我们的程序中即可解决这一问题。 参考技术A 1. 在富文本编辑器中，可以使用鼠标和快捷键来进行文本编辑，比如拖拽文本、复制、粘贴、剪切、撤销、重做等操作；
2. 可以使用鼠标选择文本，改变文字的大小、颜色、字体、字号等；
3. 可以使用鼠标调整文本的段落格式，比如调整文本的对齐方式、行距、段前段后空格等；
4. 可以使用鼠标插入图片、表格、视频、音频、链接等多媒体内容；
5. 可以使用鼠标编辑文本框，改变文本框的大小、位置、颜色等；
6. 可以使用鼠标插入表情，编辑文本的标注，比如加粗、斜体、下划线、超链接等；
7. 可以使用鼠标创建列表、标题、添加水印等操作；
8. 可以使用鼠标实现撤销、重做、查找替换等操作；
9. 可以使用鼠标插入代码，比如HTML、CSS、javascript等；
10. 可以使用鼠标编辑文档的属性，比如页面大小、页眉、页脚、页码等； 参考技术B 富文本编辑器中主要有以下操作：
1. 格式化文本：可以改变文本的字体、大小、颜色、加粗、斜体等；
2. 插入图片：可以插入图片，调整图片的大小、位置等；
3. 插入链接：可以插入文本链接或者图片链接；
4. 插入表格：可以插入表格，调整表格的大小、位置等；
5. 插入公式：可以插入数学公式；
6. 插入视频：可以插入视频，调整视频的大小、位置等；
7. 插入音频：可以插入音频，调整音频的大小、位置等；
8. 插入特殊符号：可以插入特殊符号，如括号、箭头、空格等；
9. 撤销/重做：可以撤销或重做上一步操作；
10. 搜索/替换：可以搜索文本中的某个字符串，并且可以替换成其他字符串。 参考技术C 把富文本的回车转为br标签
•2021-04-15 02:20:13
今天小编跟大家讲解下有关把富文本的回车转为br标签 ，相信小伙伴们对这个话题应该有所关注吧，小编也收集到了有关把富文本的回车转为br标签 的相关资料，希望小伙伴们看了有所帮助。

例如："我家孩子在SayABC小班课↵跟小伙伴们一起互帮互助 ↵合作竞争 学习更加有动力！↵从简单的单词到句型和场景对话 ↵孩子越来越敢于开口说英语啦！[耶]↵扫码立即领取外教课[爱心]↵让孩子从小与世界接轨~"

需要转为才能被html识别 并且换行。可以这样做。

‘↵’是回车符'/n',这段内容是通过textarea人为编辑 提交给后端保存的。编辑框中可以识别的字符 在普通的标签里面没办法识别到 所以要转换成可以识别的<br/>

方法1

string.replace(/(rn|n|r)/gm, "")
然后再用v-html=转换之后的string 就可以正常展示换行了

方法2

第二种方法是用 <pre></pre>标签 <pre> 标签的一个常见应用就是用来表示计算机的源代码。可以识别字符串中的‘/n’ ‘/r/n’, 制表符 空格...

方法3

第三种方法是用<textarea></textarea>展示 这样那边编辑的什么 这边就会显示什么 参考技术D 富文本编辑器中，<br/>可以进行文本编辑、插入图片、表格、链接等操作。

tinymce富文本编辑器

tinymce富文本编辑器，编辑内容自动给内容添加了<p></p>标签，例如我输入 hello, 得到结果是 <p>hello</p>
请问编辑器的什么设置可以禁止它自动添加标签

参考技术A 自动添加标签