HTML5畫布 - 在畫布上獲取文本框的值

（忘了旁邊的更新按鈕SAVE按鈕...）

所以我想什麼是能夠填充主圖像下面的文本框，當按下「UPDATE按鈕」時....文本將在畫布中更新。

JS代碼在HTML部分中......當它在JS部分時效果不佳。

現在我想：

<input type="text" id="nom"/> /* THE TEXTBOX */

和JS代碼繪製文本：

oCtx.fillText(document.getElementById("nom").value, 283, 350);

它不工作得非常好......因爲沒有任何反應，當我點擊更新。 .. 與FIREFOX它似乎與window.refresh工作，但不適用於Chrome，Safari ...等。什麼功能可以使它在主流瀏覽器中正常工作？

謝謝！

2012-05-28 larin555

http://jsfiddle.net/rlemon/fknjz/12/這不會在小提琴（保存）中工作，因爲安全問題...但是這個工作。我已經重新編寫了這個文件，使其更有意義......希望我的更改能夠被您理解。 – rlemon

我只重寫它，因爲修復它不會幫助你。你的流量和一切都有點搞砸了。在HTML中也內聯js <... onclick = ... />通常是要避免的。代碼和關注點的分離。 – rlemon

謝謝你的時間。我已經在Dreamweaver中導入了所有內容，但不起作用。背景圖像根本沒有顯示。我在Firefox，Chrome和Safari中試過，而且沒有工作。 – larin555

我感動的代碼寫在畫布上的文本到一個名爲「updateClicked」功能。點擊更新按鈕後，該功能將被調用。而且，我把'oCtx'變成了一個全球變量。現在工作正常。

2012-05-28 15:45:51

太棒了！ – larin555

Oh ...我剛發現如果我改變文本並再次點擊UPDATE，它會在我之前輸入的內容上添加修改後的文本...我怎樣才能讓它始終改變文本對於文本框中的內容，而不是相互添加文本行？謝謝！ – larin555

我相信你應該把一個「點擊」功能裏，而不是在「onload事件，但是，還是那句話，我也是新的這一切！

我希望這會幫助你。

OR ，試試這個：

oCtx.fillText（「的document.getElementById（」 NOM 「）值」，283，350）;

（注意引號）

最好的問候，蒂亞戈

2012-05-28 14:57:10 Tico

似乎沒有工作。但是謝謝你的時間！ – larin555

當我把報價，它似乎工作。看：http://i.imgur.com/Pia9z。jpg「 – Tico

但是UPDATE按鈕需要一個函數，它會是什麼？這就是我無法找到的 – larin555

回答