首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >如何使同步富文本编辑器将空格改为` ‘?

如何使同步富文本编辑器将空格改为` ‘?
EN

Stack Overflow用户
提问于 2022-11-02 13:24:07
回答 1查看 30关注 0票数 0

如何使同步富文本编辑器将空格替换为 

编辑器将 设置为空格而不是空格。此行为阻止css word-break: break-word;正常工作。也就是说,整个文本被视为一个词,而不是将单词保持在同一行而不分裂它们。

例如,如果我键入qqqq,然后复制并粘贴编辑器的内容,我将直观地看到以下内容:qqqq qqqq,而this.$refs.sfRichTextEditor.instance.value将产生以下结果:<p>qqqq&nbsp;<span style="background-color: unset; text-align: inherit;">qqqq&nbsp;</span></p>

是否可以使同步使用<pre>而不是<p>和空格而不是&nbsp;

因此,我的主要问题是,我希望从编辑器产生的内容的单词中断正常工作。

一个显而易见的解决方案可能是在保存值之前手动编辑它。即用空格代替&nbsp;。但这感觉很烦人,而且容易出错(虽然我想不出会产生错误的情况)。

我预计会有一个API用于这一目的。我试图谷歌和浏览文献化,但没有找到任何允许配置空间行为。如果我错过了它,你能指给我看吗?

更新

如果我只输入qqq qqq,那么我就得到了预期的空间。但是,键入qqq,复制它,然后再粘贴回它,就会生成qqq&nbsp;。因此,只有在粘贴文本时才会出现问题。这是一种我什么也做不了的行为吗?

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2022-11-09 10:16:30

此问题是由为光标指针添加到富文本编辑器中的非零宽度空间造成的,可以通过在保存数据库中的值之前将富文本编辑器内容中的非零宽度空间替换为空值来修复,或者只需为RichTextEditor content元素使用空格:预包装CSS样式。

您可以遵循以下任何一种解决方案。

使用CSS样式:

.e-richtexteditor.e-RTE-TB-展开.content内容,

代码语言:javascript
运行
复制
  .e-richtexteditor.e-rte-tb-expand .e-source-content {

    white-space: pre-wrap;

  }

样本:https://stackblitz.com/edit/vlk2lx?file=index.html,index.ts

使用Regex:

在获得RichTextEditor值后,在保存到数据库之前使用下面的代码。

//使用regex

var text = defaultRTE.getHtml();

变量替换= text.replace(/ /g,‘');//从RichTextEditor值中删除

样本:https://stackblitz.com/edit/vlk2lx-obq9ds?file=index.html,index.ts

票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/74289919

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档