我無法使用 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. 請幫助解決這個問題。 謝謝：）

 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

下面的代碼將使您的輸入記錄在控制台中。 您需要在 myFunction function 中包含控制台日志，這樣只有在用戶單擊“單擊”按鈕后，輸入的值才會打印到控制台/檢查。 你不應該創建一個需要用戶輸入的變量，並立即嘗試訪問它的值，因為當程序加載時，用戶還沒有在輸入中輸入任何值。 所以下面，你的 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