如何在谷歌图表中使用输入表单值

Question

我创建了一个表单并尝试在谷歌图表中显示提交的值。我试图为 drawChart() 创建包装器，并希望在单击提交按钮后加载 drawChart()。但是，drawChart() 函数被调用 onload。我的代码有什么问题？

HTML-

 <form method= "post" action = "#" id="formValue"> 
        <label><input type="number" value="1" id="ip1"/>inpu1</label>
        <label><input type="number" value="2" id="ip2"/> input2</label>
        <input type="submit" value="Add" onclick="initializer()"/>
    </form>

JS-

<script>
var ip1, ip2;
var str = "hello";
var str2 = "hello2";
function initializer(){
    ip1 = document.getElementById("ip1").value;
    ip2 = document.getElementById("ip2").value;
    drawChart();
}
 google.charts.setOnLoadCallback(initializer);
  google.charts.load('current', {'packages':['corechart']});

function drawChart() {
    var x2= [
    [
        str,
        ip1
    ],
    [
        str2,
        ip2
    ]
];
    var data = new google.visualization.DataTable();
     data.addColumn('string', 'Topping');
    data.addColumn('number', 'Slices');
    data.addRows(x2);

    var options = {'title':'How Much Pizza I Ate Last Night',
                   'width':500,
                   'height':600};


    var chart = new google.visualization.PieChart(document.getElementById('chart_div'));
    chart.draw(data, options);

Answer 1

删除这个...

google.charts.setOnLoadCallback(initializer);

它运行initializer 当...

google.charts.load('current', {'packages':['corechart']});

结束了。