Primefaces文本编辑器:使用JavaScript将文本转换为HTML不起作用

3

首先,让我声明这是我在这里的第一个问题,我是这个社区的新成员。请友善对待我,不要犹豫纠正我,指导我去哪里找答案或学习等。

我发布这个问题是为了寻找解决方案的最后一丝希望,因为我自己没有找到或想出任何办法(也没有同事的帮助)。


基本上 PrimeFaces p:editor 目前在我正在工作的程序中的某个页面上使用。用户使用它来输入和格式化文本,然后将其作为电子邮件发送。目前,JavaScript 函数 saveHTML 将电子邮件内容转换为 HTML,因此消息代码看起来完全像这样:
  <div style="font-weight:normal; font-style:normal">

  <div style="font-size:11pt; font-family: Calibri,sans-serif">
    <br>In case of questions please send a message to: <a href="mailto:sample@sample.com" target="_blank">sample@sample.com</a>.
    <br><br>Yours Sincerely
  </div>

自某一时刻起,用户报告编辑器无法预测地更改文本字体等问题,于是我发现它已经过时,想要将其更改为p:textEditor
textEditor似乎工作正常(具有编辑功能)并且看起来不错,但在测试期间检查了发送的电子邮件。结果发现textEditor不支持JavaScript函数saveHTML,因此该函数失败,并且消息代码被完全按原样发送:
<p><br></p><p>In case of questions please send a message to:: <a href="mailto:sample@sample.com" target="_blank">sample@sample.com</a>. </p><p><br></p><p>Yours Sincerely</p><p><br></p><p><strong>Anna Li</strong></p>

然后我发现这个文本编辑器是基于QuillJstextEditor文档中的信息)开发的,如果我正确理解了GitHub问题,那么它不支持将文本转换为HTML。

所以问题是:

  • 是否有方法可以修复textEditor,使saveHTML函数可用?或者是否有其他可以替代的函数?或者是否有任何像saveHTML函数一样优雅的解决方案?如何解决这个问题?(因为我的最后一个想法是制作自己的Java函数来将文本转换为HTML,但与saveHTML相比,这个选项需要花费长时间,痛苦且难以实现)

PrimeFaces版本7.0.7;PrimeFaces扩展版本7.0.2。

请注意,我不想使用来自另一个组织/公司的文本编辑器。


1
生成的HTML看起来不同,但问题出在哪里? - Selaron
@Selaron,它不包含任何有关文本格式的信息,例如字体、字重、行间距等等。因此,用户可以使用textEditor格式化文本,但这不会反映在HTML中。当HTML被查看时,差异是明显的,例如在W3Schools Tryit Editor中:https://www.w3schools.com/html/tryit.asp?filename=tryhtml_default。 - A.Alessio
1个回答

4
您遇到的问题是,p:textEditor 会生成不可移植的 HTML 代码,这严重限制了其整体用途。最相关的 GitHub 问题似乎是 PrimeFaces TextEditor: value returns HTML with Quill editor specific CSS (aka is PF's Quill implementation useless?) #4486
这意味着除了切换到pe:ckEditor以外,似乎没有其他可行的解决方法,而在您的情况下,这应该不是什么大问题,因为您已经使用 PE。 p:textEditor 使用的 Quill 编辑器使用 CSS 类而不是内联样式表来生成 HTML 输出。您需要将这些 CSS 定义与生成的 HTML 一起传递,这对于大多数用例来说并不是一个选项。

谢谢你,@Selaron。我现在要尝试一下! - A.Alessio
我尝试了 pe:ckEditor,@Selaron,它生成的HTML正如它应该做的那样。现在我正在解决其中的外文字符问题,但这最终是另一个问题。 :) 非常感谢您的帮助!你救了我的一天!FYI,对于任何想使用 pe:ckEditor 的人来说,有必要添加新的依赖项,请参见 https://dev59.com/35ffa4cB1Zd3GeqP9YlZ。 - A.Alessio

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接