使用數字/文本輸入字段在ChartJs中設置數據值可以阻止顯示圖表

Question

我仍然相對較新的HTML和Javascript代碼，所以這可能只是一個小愚蠢的錯誤。

基本上我正在嘗試使用chartjs創建折線圖，對於其中一條線我希望用戶能夠輸入他們自己的數據，所以我一直在測試一些方法，但無法弄清楚為什么他們不行。

我希望使用document.getElementById獲取第一個數字輸入的值，然后將其用作折線圖的數據值，例如：

data: [addData(), 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],

這是如何調用添加輸入值作為數據的函數，然后函數本身是：

function addData()  {

        var input = document.getElementById("testId").value;

     }

我也試過使用返回輸入; 但是當我使用其中任何一個時，整個圖表就會消失，但是如果我使用下面的函數來添加addData（），那么圖表仍可正常工作並接受2作為第一個數據值：

function addData()  {

        var input = 2;
        return input;

     }

這是數字輸入代碼：

Birth: <input  type="number" maxlength="4" id="testId" value="2"><br>

當我嘗試使用數字值的數字輸入字段時，為什么整個圖表消失的任何想法？

編輯：我剛剛解決了這個問題，感謝Shai Aharoni指出任何可能的錯誤，我只需要在腳本之前重新排列輸入字段的順序，這只是一個愚蠢的錯誤。

Answer 1

當我沒有完整的例子時，很難評估我的解決方案。 所以我不確定，但我希望以下內容對您有所幫助：可能是您的代碼有一個簡單的類型錯誤

var input = document.getElementById("testId").value;

為輸入變量分配一個字符串值。 但是，我認為，您需要一個整數作為圖表的輸入。

解決方案可能是：

var input = parseInt(document.getElementById("testId").value)

雖然您已將輸入字段定義為“數字”，但javascript不會使用此類型自動轉換值。 所以，你必須自己轉換價值。