html5 canvas動態文本框

Question

我想知道是否有方法讓我打開文本框供用戶輸入onclick事件？我將如何去做這件事？我現在在想，可能有一種方法可以讓我抓住用戶在畫布上輸入的內容，並使用我已閱讀的方法輸出文本。這有可能嗎？但是，我將如何讓用戶在第一時間在畫布上輸入？

我已經做了大量的閱讀，我能找到的所有例子都是關於簡單地將文本輸出到畫布上而不是創建文本框。

任何想法？

Answer 1

一個簡單的解決方案 - 使用Javascript的警報框。這將使我們能夠抓取用戶想要在屏幕上放置的文本。然後在畫布上寫出你想要的文本（很多關於如何在畫布上寫文本的教程）。

Answer 2

你必須從字面上做一個，因爲在onclick事件觸發，你做的事：var myInput = document.createElement("textarea");

您需要設置myInput.style.width，height，top，left，當然還有myInput.style.position到"absolute"，那麼其定位用戶期望的地方。

然後您需要爲其分配事件。也許在keydown它會查找Enter鍵，並且如果按下Enter鍵，它將會消失並提交文本，但是您希望它提交。

然後將其添加到頁面。

也許它會對模糊事件做同樣的事情（如果用戶點擊了）。

Answer 3

canvas是一個位圖圖像。你不能把一個元素「放在裏面」。不過，您可以將其懸停在其上。我認爲你在尋找的是html5 contenteditable attribute。