【问题标题】:Canvas-based editor - How?基于画布的编辑器 - 如何?
【发布时间】:2011-08-09 03:26:13
【问题描述】:

我一直在尝试使用 HTML5 画布开发文本编辑器(作为个人项目),但在实现复制/粘贴/退格功能时遇到了问题。我已经研究了大约六个类似这个项目的源代码,但我仍然没有找到解决方案。

谁能推荐一种快速、有效的方法来实现这种功能?

【问题讨论】:

  • 简短回答,不要。 Canvas 完全不适合用作文本编辑器。见Simon Sarris's answer here
  • 正如我所说,这是一个个人项目,所以它是否是一个好主意并不重要。

标签: javascript html text canvas text-editor


【解决方案1】:

我们使用这样的方式:焦点在隐藏的文本区域,所以 ctrl-v 可以正常工作。在文本更改时,您会更改画布图像。您可以轻松同步选择。您可以绑定 textarea "input" 事件来捕获所有更改:

输入:当用户在文本框中输入文本时发送此事件。此事件仅在显示的文本发生变化时调用,因此在用户按下不可显示的键时不会调用。

我认为,这是最好的也是唯一正确的方法(没有它,你无法在 javascript 中使用剪贴板)

【讨论】:

  • “隐藏的文本区域”是什么意思?我应该设置 CSS 属性 display:hidden; ?我可以不将 textarea 添加到元素树吗?
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2013-02-08
  • 1970-01-01
  • 2015-07-05
  • 2017-08-29
相关资源
最近更新 更多