HTML5 Canvas - 在画布中获取文本框值

时间:2012-05-28 14:51:52

标签: javascript html5 canvas html5-canvas

这是我的JSFiddle:

http://jsfiddle.net/fknjz/5/

(忘记UPDATE按钮旁边的SAVE按钮......)

所以我想要的是能够填充主图像下方的文本框,并且当按下“UPDATE按钮”时......文本将在画布中更新。

JS代码在HTML部分......当它在JS部分时它运行不正常。

现在我试过了:

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

以及用于绘制文本的JS代码:

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

它工作得不好......因为当我点击UPDATE时没有任何反应...... 使用FIREFOX它似乎正在使用window.refresh ...但不能在Chrome,Safari等中工作。什么功能可以使它在主流浏览器中正常工作?

谢谢!

2 个答案:

答案 0 :(得分:0)

我相信你应该放入“onclick”功能,而不是“onload”。但是,再说一次,我也是新手!

我希望这会对你有所帮助。

<小时/> 或者,试试这个:

oCtx.fillText(“document.getElementById(”nom“)。value”,283,350);

(注意引号)

<小时/> 最好的祝福, 蒂亚戈

答案 1 :(得分:0)

JSFiddle:http://jsfiddle.net/fknjz/17/

我将用于在canvas中写入文本的代码移动到名为“updateClicked”的函数中。单击更新按钮,将调用此函数。而且,我把'oCtx'变成了一个全局变量。 现在工作正常。