javascript - 如何在 Web 应用程序中添加函数的文本调用？

Question

我目前正在开发一个网络应用程序，即将开始构建前端以配合后端。

我的计划是除了用户单击图标将 block 添加到所见即所得之外，他们还可以键入命令。例如，如果用户想在 WYSIWYG Canvas 上添加一个矩形，可以单击矩形图标，然后单击 Canvas 上的 2 个对 Angular ，然后很快就会出现一个矩形。此外，我想允许用户键入 RECT，然后按 ENTER 键，然后开始矩形操作。然后用户可以键入笛卡尔坐标，而不是第一次和/或第二次单击。

我不确定用于创建 WYSIWYG Canvas 的技术，但是谁能建议实现上述功能的最佳技术是什么？我对这些事情一无所知。

我的假设是 JavaScript 可用于监视击键并可用于调用函数，但我不确定这是否可行。

如有任何建议，我们将不胜感激!我有点担心我会花钱请承包商开始使用 HTML5 进行构建，然后发现我的文本输入想法不兼容!

Answer 1

这很容易，伙计。

您的输入可能看起来有点像这样:<input type="text" onchange="check(this)"/>

您可以创建一些小函数来绘制形状。我没有详细介绍，但这里有一个 JSfiddle 示例:https://jsfiddle.net/gpnb9aba/1/

您可以在框中键入 Circle 或 Rect(区分大小写)，按回车键，它会绘制它(在预定位置)。可以为这个预定位置分配一个变量并根据用户输入进行更改，但我没有这样做。我的 fiddle 仅用于概念验证。

---

关于用鼠标绘制矩形，看看我的另一个 JSFiddle:https://jsfiddle.net/Lppzrngg/1/

使用此 jsfiddle，您可以单击并绘制以创建矩形的两个对 Angular ，然后它会自动存储并绘制这些矩形。