我无法使用 JavaScript 访问我的 canvas 上的输入值

Question

I am not able to get the value of input statement in my JavaScript function, as i want my output on my canvas section of html but it is not showing anything on my canvas as well as in console.log function also. I am not able to get the value of input statement in my JavaScript function, as i want my output on my canvas section of html but it is not showing anything on my canvas as well as in console.log function also. please help to solve this problem.请帮助解决这个问题。 thanks:)谢谢：）

 var x = document.getElementById("name").value; console.log(x); function myfunction() { var canvas = document.getElementById('page'); var ctx = canvas.getContext("2d"); ctx.font = "15px Arial"; ctx.fillText(x, 10, 50); }

 <:DOCTYPE html> <html> <head> <title>yoyo</title> </head> <body> <p>hi everyone;</p> <div> <label>Your text here-</label><br> <input type="text" name="name" id="name"> </div> <div> <canvas id="page" width="200" height="300" style="border: solid; background: yellow;"></canvas> <button onclick="myfunction()">click</button> </div> </body> </html>

Answer 1

The code below will get your input logged in the console.下面的代码将使您的输入记录在控制台中。 You need to have the console log inside of your myFunction function, so that the value of the input is only printed to console/checked once the user clicks the 'click' button.您需要在 myFunction function 中包含控制台日志，这样只有在用户单击“单击”按钮后，输入的值才会打印到控制台/检查。 You should not create a variable requiring user input, and immediately try to access its value, because when the program is loaded the user has not input any value into the input yet.你不应该创建一个需要用户输入的变量，并立即尝试访问它的值，因为当程序加载时，用户还没有在输入中输入任何值。 So below, your x variable is created by accessing the #id, the user fills in the input field, clicks the button, then the value of the x variable is checked, and printed to the console.所以下面，你的 x 变量是通过访问#id 创建的，用户填写输入字段，单击按钮，然后检查 x 变量的值，并打印到控制台。

var x = document.getElementById("name");

function myfunction() {
  console.log(x.value);
};

我无法使用 JavaScript 访问我的 canvas 上的输入值

问题描述

1 个解决方案

解决方案1
0 2020-06-22 21:31:13

我无法使用 JavaScript 访问我的 canvas 上的输入值

问题描述

1 个解决方案

解决方案1 0 2020-06-22 21:31:13

解决方案1
0 2020-06-22 21:31:13