【问题标题】:Editable text widget for GWT?GWT 的可编辑文本小部件?
【发布时间】:2012-07-25 19:43:10
【问题描述】:

我在 GWT 中有一个应用程序,它提供了很多小段落,让用户编辑它们。现在我只有一个查看模式、一个 HTML 段落和一个编辑模式,为此我使用标准的 HTML TextArea。

是否有不需要使用 TextArea 或在模式之间切换的流畅 GWT 段落编辑小部件?请注意,我确实不需要需要富文本小部件,因为我不需要粗体、斜体、项目符号等。

我愿意使用 jQuery 或其他 JavaScript 库解决方案,只要它真的很健壮并且与我正在做的其他事情完全分离。我不想照看/破解 JavaScript。

不知何故,我认为这个问题很难,因为 Google Docs 做得不好,甚至 stackoverflow 让我使用一个非常类似于 TextArea 的框来编辑稍后显示为 HTML 段落的文本。

【问题讨论】:

  • RichTextArea有什么问题吗?
  • @ThomasBroyer 谢谢!每当我看到一个实际的富文本示例时,它都会附带所有这些粗体、斜体等按钮,我认为这些按钮是小部件固有的。但是我只是看了这个例子:examples.roughian.com/index.htm#Widgets~RichTextArea 似乎它们不是,这意味着它应该可以工作。谢谢。

标签: gwt web-applications textarea


【解决方案1】:

我会使用 HTML ContentEditable。 http://html5demos.com/contenteditable/

<div contenteditable="true">
</div>

您可以使用 JS 框架来绑定更改。我注意到 JS 'change' 事件存在问题,但 'blur' 事件运行良好。

【讨论】:

  • 哇,太棒了。还没看源码。有什么陷阱吗?我想我可以提供绑定,以便用户可以更改非文本属性,例如创建新的项目符号列表?
  • @Daniel:contenteditable 的最大问题是安全性。您始终可以粘贴格式化的内容,浏览器会将其转换为 HTML。当您将内容发送到服务器,然后在 HTML 上下文中再次显示时,这允许各种 XSS 攻击。您需要清理服务器上的 HTML,但黑名单方法不可靠,并且使用 contenteditable 的白名单非常很难,因为每个浏览器都会生成完全不同的 HTML 代码(生成的 HTML 会变得更加复杂,如果您在使用不同浏览器创建的浏览器中编辑文本)。
  • 我真的只需要文本,所以我可以剥离所有的 HTML。此外,Google 提供了一个 SafeHtml 库来处理这个问题:developers.google.com/web-toolkit/doc/latest/…
猜你喜欢
  • 2011-11-20
  • 2020-10-02
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2013-07-29
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多